（一）关于CSS的介绍
选择器{ 属性1:属性值; 属性2:属性值; …… } //例子 p{ text-indent:2em;/*首行缩进2个字*/ line-height:180%;/*行高为文本高度的180%*/}
（三）选择器：“标签选择器”、“id选择器”、“class选择器”、“复合选择器”、“伪类选择器”
3.1：标签选择器——作用范围：整个文档所有该标签都会用上定义的样式，适合用作底层的基础样式，比如定义整个文档的字体、背景颜色、超链接样式等。
3.1.1：单个标签
1 body{ 2 font:16px/1 "microsoft YaHei";/*整个文档字体为16px，行高为文字1倍的微软雅黑。*/ 3 color:#333;/*文字颜色*/ 4 background-color:#eee;/*背景颜色*/ 5 }
3.1.2：多个标签
1 h1,h2{ 2 color:#F60; 3 text-align:center;/*文本在水平方向居中对齐*/ 4 letter-spacing:2px;/*文字之间的间隔*/}
3.1.3：多个标签用空格隔开，表示包含关系，也就是嵌套，后面的标签嵌套在前面的标签里。
ps:这里要注意的是标签的解释是从右边往左边解释的，比如下面的p span，先找到span，再找到p里面的span，所以选择器应该嵌套越少越好。
1 p span{ 2 color:#C03; 3 font-size:1.1em;/*文字大小是行内文字的1.1倍。*/}
3.2:ID选择器——
id选择器，具有唯一性。一个html对象的id名称是唯一的，id名称不能被重复使用。
id选择器以“#”开头。这个id名字只能用一次。
任何标签都有id和class属性。
比如为一个div添加了id="main"的属性，要为这个div做唯一的样式，则可以使用#main{样式}的方式。
#main选择器指向id="main"的html对象，把样式应用在该html对象上面。选择器相当于一个挂钩。
1 #main{ 2 样式 3 } 4 5 <div id=”main”>…</div>
3.3、class选择器
class在程序里面表示：类。物以类聚，人以群分，具有相似性。
class的语法结构是以“.”开头，class样式可以被任何需要它的标签所调用，可以使用很多次，还可以组合。
比如定义了如下几个class样式：
ps:
其实可以把class看成很多具有特定功能的零件，某个html需要什么样式，可以通过组合不同的class零件达到最大化的效果。该html对象会使用所有被调用的class样式。
感觉像小孩儿玩积木游戏呢^_^
注意：id和class的名字是自己定义的，所以一定要符合命名规则，不能用数字开头，只能字母开头，可以包含数字和下划线。不能使用保留的标签关键字。比如不能使用"#2"，".div"，"#h1"，".3a"等格式。
class最好的命名方式是取属性和属性值的首字母或者字母与数字的组合。
1 .bg1{ 2 background-color:#ccc; 3 } 4 .bg2{ 5 background-color:#eee; 6 } 7 .color1{ 8 color:#f99; 9 } 10 .color2{ 11 color:#666; 12 } 13 .f18{ 14 font-size:18px; 15 } 16 .f16{ 17 font-size:16px; 18 } 19 .p20{ 20 padding:20px;/*内边距*/ 21 } 22 .m20{ 23 margin:20px;/*外边距*/ 24 }
1 <h1 class="color1 f18"></h1> 2 <h2 class="color2 f16"></h2> 3 <div class="bg1 p20 m20"></div> 4 <div class="bg2 p20"></div>
3.4、复合选择器
一般就是id、class、标签选择器的混合物。
比较典型的就是这种，对某个id选择器下面的所有某标签使用样式。
<div id="navlist"> <ul> <li><a href="#" id="current">HTML教程</a></li> <li><a href="#" class="css">CSS教程</a></li> <li><a href="#">jQuery教程</a></li> <li><a href="#">SEO教程</a></li> <li><a href="#">关于我</a></li> </ul> </div>
比如现在对id为"navlist"下面的ul下面的li下面的所有a标签使用一样的样式，选择器可以这样写：
1 #navlist ul li a{ 2 样式 3 }
如果想让某个a标签样式不一样，则可以为这个a添加一个id属性或者class属性，那么可以使用如下选择器：
1 #navlist ul li a#current{ 2 样式 3 } 4 #navlist ul li a.css{ 5 样式 6 }
有空格的必须是上下级的嵌套关系，而这个id和class是a的直接属性，相当于是有id="current"的a和有class="css"的a。
3.5、伪类选择器-—
因为在IE6里面只支持a超链接的伪类，导致在CSS2里面伪类选择器使用比较少，用得最多的就是a:hover这种伪类选择器。
什么是伪类？其实就是本身并不存在，在特定条件下才会触发的对象。
比如超链接a一共有四个状态：访问前，鼠标悬停，当前被点击，已访问这4种伪类效果.
超链接的4种状态，需要有特定的书写顺序才能生效。
1 a:link {} /*访问前*/ 2 a:visited {}/*已访问*/ 3 a:hover {} /*鼠标悬停*/ 4 a:active {} /*当前被点击*/
注意，a:hover 必须位于 a:link 和 a:visited 之后，a:active 必须位于 a:hover 之后
可靠的顺序是：l(link)ov(visited)e h(hover)a(active)te, 即用喜欢(love)和讨厌(hate)两个词来概括
只不过我们一般不会定义四种状态，大部分的网站只需要鼠标悬停（经过）时样式不一样即可，其它三种状态都是一样的。所以可以定义成这样的样式：
1 a{ 2 color:#333; 3 text-decoration:none;/*没有下划线*/ 4 } 5 a:hover{ 6 color:#f30; 7 text-decoration:underline;/*有下划线*/ 8 }