您的位置：首页 > Web前端 > CSS

CSS-伪类选择器

2013-12-27 17:47 531 查看

1.超链接的样式，可以通过伪类选择器进行设置。

A:link

A:visited

A:hover

A:active

PS:注意hover必须置于link和visited之后才有效，而active必须置于hover之后才有效。并且伪类对大小写不敏感。:Hover和:ACTive都是正确的写法

2.通过位置进行选择

:first-child（在IE中，必须声明<!DOCTYPE>,first-child才有效。在jquer中有:first :first-child的效果是不一样的，前者是选中匹配的第一个元素，后者是选中匹配的所有的元素的第一个元素）

示例：页面代码如下：

<script>
$(document).ready(function() {
var firsts = $("ul li:first-child");
$.each(firsts, function(index, value) {
$(this).css('color', 'red');
});
});
</script>
</head>

<body>
<ul>
<li>
第一个ul的第1个选项
</li>
<li>
第一个ul的第2个选项
</li>
<li>
第一个ul的第3个选项
</li>
</ul>
<br>
<ul>
<li>
第二个ul的第1个选项
</li>
<li>
第二个ul的第2个选项
</li>
<li>
第二个ul的第3个选项
</li>
</ul>

</body>

结果：

当改为如下代码之后：

$(document).ready(function() {
var firsts = $("ul li:first");
$.each(firsts, function(index, value) {
$(this).css('color', 'red');
});
});

结果：

:first-letter

:first-line

:before(css2)

:after(css2)

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航