CSS笔记
CSS 5种样式
1、标签选择符 使用XHTML中已有的标签做为选择符
如：p{ width : 250px;}
h1{color : #ff0000 }
2、ID选择符 使用控件的ID值，ID值是唯一的 需要加 ‘ # ’
如：#hello{ color : #ffooff }
<div id="hello" >你好</div>
3、class选择符 使用控件的class属性指定，多个标签可以使用同一的样式，class自定义 需要加‘ . ’ (句点)
如 ： .reader{ color ; #00ff00 }
<div class="reader">你好</div>
4、伪类及伪对象 此选择符是一组CSS预定义好的类和对象，不需要进行id和class的属性的声明
如： a : visited { color:#ffee00 } //用于超链接访问过后，样式变为红色文本
在实际使用中使用最多的是超链接的4中状态 即：link、hover、active、visited
| 伪类 | 用法 |
| ：link | 超链接未被访问时 |
| ：hover | 对象（一般为超链接）在鼠标滑过时 |
| ：active | 对象（一般为超链接）被用户单击时（鼠标单击未释放） |
| ：visited | 超级链接未被访问后 |
| ：focus | 对象成为输入焦点时 |
：first-child |
对象的第一个子对象 |
| ：first | 页面的第一页 |
| 伪对象 | 用法 |
| ：after | 设置某个对象之后的内容 |
| ：first-letter | 对象内的第一个字符 |
| ：first-line | 对象第一行 |
| ：before | 设置某一对象之前的内容 |
5、通配选择符 需要加‘*’
如：*{margin：10px} //所有对象外边距为10px
各种样式可以组合使用，常用4种组合方式
1、群组选择符
需要对多种选择符进行相同样式的设置时，用逗号‘，’隔开
如：p，span，div { color ：#ff0000 }
2、包含选择符
通过标签嵌套包含关系组合选择符，包含2个选择符用空格隔开
如： p span { color：#ff0000 } //是有p标签内的span标签包含文本被设置为红色
3、标签指定式选择符
即标签选择符与id和class的组合，两者之间不需分隔
如：p#hello { color：#ff0000 } // id名为hello 的 p 标签 的文本为红色
p.reader { color：#ff0000 } // class名为reader 的 p 标签 的文本为红色
4、自由组合标签
如：p#hello h1{ color ：#ff0000 } //id名为hello的p标签内的h1标签的文本为红色
CSS中的数值单位
| 单位 | 说明 |
| px | 像素（Pixel） |
| em | 相对当前文本尺寸的倍数 |
| ex | 相对字符高度的倍数 |
| pt | 点/磅（Point） |
| pc | 派卡（Pica） |
| in | 英寸（Inch） |
| mm | 毫米 |
| cm | 厘米 |