大家在前端开发中经常要对某些页面元素进行特定的控制，使得它能够以正确的样式呈现在浏览者的面前，既然要选择元素，那除了常见的一般选择器以外，css2.1还为我们制定了一些非常便捷的选择器，例如first-child。
先看货（主要样式）：
ul{width:500px;height:200px;margin:0 auto;list-style:none;border:1px solid #000FFF;}
p{background:#DADADA;}
li:first-child{font-size:18px;font-weight:bold;color:#660000;}
em:first-child{font-weight:bold;color:#FF0000;}
结构：
< ul >
< li >< span >I’m first-child of li< /span >:youshang.com< /li >
< li >kingdee.com< /li >
< li >fly.com< /li >
< /ul >
< p >ok!this is first em:< em >< span >[Bingo]</span >[here]< /em >,& this is another em:< em >[Bing2]< /em > then last one:< em >[Bingo3]< /em >< /p >
在这个例子中，很多人会认为li的first-child应该是span元素，而p的会是em元素，但是实际上，并不是这样，在这里，first-child指的应该是某元素集的第一个，是所有某元素中的第一个。大家可以看DEMO。
发表评论