标签:
一直不太明白 E:nth-child(n)和E:nth-of-type(n)的区别。今天花时间研究了一下,终于知道了它们之间的相同点和差异点。总结如下,以防时间长了,忘记了
有点绕,举个例子先。我先定义用于测试的HMTL
<div> <p>aaaa</p> <h3>bbbbb</h3> <p>ccccc</p> <h3>ddddd</h3> </div>
测试E:nth-child(n),相关的CSS如下:
h3:nth-child(1){
background-color:#00ff90; //不选择任何元素,因为第一个子元素是p,不是h3
}
h3:nth-child(2){
background-color:#00ff90; //选择bbbbb
}
测试E:nth-of-type(n),相关的CSS如下:
h3:nth-of-type(1){
background-color:#00ff90; //选择bbbbb
}
h3:nth-of-type(2){
background-color:#00ff90; //选择ddddd
}
CSS3中 E:nth-child(n) VS E:nth-of-type(n)
标签:
原文地址:http://www.cnblogs.com/princeding/p/4453208.html