CSS伪类
伪类
浏览器支持：IE Internet Explorer, F: Firefox, N: Netscape。
W3C：“W3C” 列的数字显示出伪类属性由哪个 CSS 标准定义（CSS1 还是 CSS2）。
| 伪类 |
作用 |
IE |
F |
N |
W3C |
| :active |
将样式添加到被激活的元素 |
4 |
1 |
8 |
1 |
| :focus |
将样式添加到被选中的元素 |
- |
- |
- |
2 |
| :hover |
当鼠标悬浮在元素上方时，向元素添加样式 |
4 |
1 |
7 |
1 |
| :link |
将特殊的样式添加到未被访问过的链接 |
3 |
1 |
4 |
1 |
| :visited |
将特殊的样式添加到被访问过的链接 |
3 |
1 |
4 |
1 |
| :first-child |
将特殊的样式添加到元素的第一个子元素 |
|
1 |
7 |
2 |
| :lang |
允许创作者来定义指定的元素中使用的语言 |
|
1 |
8 |
2 |
<style type="text/css">
a:link {color: #FF0000} /* 未访问的链接 */
a:visited {color: #00FF00} /* 已访问的链接 */
a:hover {color: #FF00FF} /* 鼠标移动到链接上 */
a:active {color: #0000FF} /* 选定的链接 */
input[type="text"]:focus{border:1px solid #f33;}
input[type="button"]:hover{color:#f00}
table{width:400px; border:1px solid #ccc}
td{border:1px solid #ccc}
td:first-child{color:#f00}
tr:hover{background:#eee}
q:lang(no){
quotes:"~" "~"
}
html演示 IE8以上
<p>
<a href="http://tomieric.tk">tomieric</a>
</p>
<p>
<input type="text" name="text1" value="" />
<input type="button" name="submit" value="确定" />
</p>
<p>这是测试<q lang="no">博客园</q><p>
<table>
<tr><td>第一行</td><td>第一行</td></tr>
<tr><td>第2行</td><td>第一行</td></tr>
</table>
浏览器支持：IE Internet Explorer, F: Firefox, N: Netscape。
W3C：“W3C” 列的数字显示出伪类属性由哪个 CSS 标准定义（CSS1 还是 CSS2）。
| 伪类 |
作用 |
IE |
F |
N |
W3C |
| :active |
将样式添加到被激活的元素 |
4 |
1 |
8 |
1 |
| :focus |
将样式添加到被选中的元素 |
- |
- |
- |
2 |
| :hover |
当鼠标悬浮在元素上方时，向元素添加样式 |
4 |
1 |
7 |
1 |
| :link |
将特殊的样式添加到未被访问过的链接 |
3 |
1 |
4 |
1 |
| :visited |
将特殊的样式添加到被访问过的链接 |
3 |
1 |
4 |
1 |
| :first-child |
将特殊的样式添加到元素的第一个子元素 |
|
1 |
7 |
2 |
| :lang |
允许创作者来定义指定的元素中使用的语言 |
|
1 |
8 |
2 |
<style type="text/css">
a:link {color: #FF0000} /* 未访问的链接 */
a:visited {color: #00FF00} /* 已访问的链接 */
a:hover {color: #FF00FF} /* 鼠标移动到链接上 */
a:active {color: #0000FF} /* 选定的链接 */
input[type="text"]:focus{border:1px solid #f33;}
input[type="button"]:hover{color:#f00}
table{width:400px; border:1px solid #ccc}
td{border:1px solid #ccc}
td:first-child{color:#f00}
tr:hover{background:#eee}
q:lang(no){
quotes:"~" "~"
}
html演示 IE8以上
<p>
<a href="http://tomieric.tk">tomieric</a>
</p>
<p>
<input type="text" name="text1" value="" />
<input type="button" name="submit" value="确定" />
</p>
<p>这是测试<q lang="no">博客园</q><p>
<table>
<tr><td>第一行</td><td>第一行</td></tr>
<tr><td>第2行</td><td>第一行</td></tr>
</table>
«
»