CSS 伪类
CSS 伪类用于向某些选择器添加特殊的效果。伪类是以“:”号表示，且不能单独存在。
例子：
#nav a:hover {
color: #FF0000;
text-decoration: underline;
}
这个例子表示在 id="nav" 的网页元素内，将鼠标放到超链接上（不点击），其连接的文本颜色为红色，出现下划线（如果原先没下划线的话）。
这是一个伪类的典型应用，通过向该样式增加更多样式，可以制作出网站常见的导航条滑动效果，以后我们会有专题讲述具体制作过程。
伪类列表如下：
| 伪类 | 说明 |
|---|---|
| :link | 设置 a 对象在未被访问前的样式 |
| :hover | 设置a 对象在其鼠标悬停时的样式 |
| :active | 设置 a 对象在被用户激活(在鼠标点击与释放之间发生的事件)时的样式 |
| visited | 设置 a 对象在其链接地址已被访问过时的样式 |
| :focus | 置对象在成为输入焦点(该对象的 onfocus 事件发生)时的样式 |
| first-child | 设置 元素 的第一个子对象的样式 |
| :first | 设置页面容器第一页使用的样式，仅用于“@page”规则 |
| :left | 设置页面容器位于装订线左边的所有页面使用的样式，仅用于“@page” 规则 |
| :right | 设置页面容器位于装订线右边的所有页面使用的样式，仅用于“@page” 规则 |
| :lang | 设置对象使用特殊语言的内容的样式 |
对于以上诸多伪类样式，我们只需掌握常用的 :link 到 :first-child 即可。
提示
- 对于<a>标签中无“href”属性的内容，:link、:hover、:active及:visited均无效。
- :hover 必须被置于 :link 和 :visited 之后，才是有效的。
- :active 必须被置于 :hover 之后，才是有效的。
伪对象
伪对象的语法同伪类。
| 伪对象 | 说明 |
|---|---|
| :first-letter | 设置对象内的第一个字符的样式 |
| :first-line | 设置对象内的第一行的样式，此伪对象仅作用于块对象 |
| :before | 用来和 content 属性一起使用，设置在对象前(依据对象树的逻辑结构)发生的内容 |
| :after | 用来和 content 属性一起使用，设置在对象后(依据对象树的逻辑结构)发生的内容 |
一个首行字符变大的效果：
.first-xx:first-letter{
font-size: xx-large;
}
html代码：
<p class="first-xx"> 这是利用伪类“:first-letter”首字符变大的效果。还可以利用伪类制作常用的首行缩进两字符等效果。 </p>
这是利用伪类“:first-letter”首字符变大的效果。还可以利用伪类制作常用的首行缩进两字符等效果。
