CSS 选择器

本人是先学习了Jquery,知道了选择器这一说,然后才去看CSS选择器的.本以为CSS一般不会这么复杂吧.没想到,顶尖的设计师用的CSS这么高端,看的我稀里糊涂的,还要对照文档一个个看.这边就记下来,作为我下次温习材料.

首先来个简单的

.important.warning{color:red;}
<p class="important warning">
This paragraph is a very important warning.
</p>

h1 em {color:red;}
<H1>THIS <EM>IS </EM><H1>

第一个是结合元素选择器,第二个是后代选择器,区别就在于CSS键之间是否有空格.当然以上两个是基础.那看下面:

[class ^="glyph-"]:before,[class *=" glyph-"]:before,[class ^="glyph-"]:after,[class
*=" glyph-"]:after {
font-family: "aboutme-glyphs";
font-style: normal;
font-weight: normal;
speak: none;
display: inline-block;
text-decoration: inherit;
text-align: center;
width: 1em;
line-height: 1em;
font-variant: normal;
text-transform: none;
font-size: 120%;
position: relative;
top: .05em;
width: 1em;
xbackground-color: rgba(0, 0, 0, 0.1)
}

.glyph-arrow-up:before {
content: '\e806'
}

.buttonbar>.button {
float: left;
margin-right: -1px;
z-index: 1;
position: relative;
border-radius: 0;
white-space: nowrap
}

大家如果一看就明白,那肯定也是大牛,我也是查了半天资料才知道的.今天没时间一个个解释了,不懂的查查文档应该就知道了哦!