html – CSS nth-child错过了元素

概述好像css nth-child错过了它的目标,任何想法？ jsFiddle source HTML： <a href="#">red</a><br /><a href="#">none</a><br /><a href="#">gray</a> CSS： a:nth-child(1) { color:red;}a:nth-child(3) { color:gray;} 好像CSS nth-child错过了它的目标,任何想法？

jsFiddle source

HTML：

<a href="#">red</a><br /><a href="#">none</a><br /><a href="#">gray</a>

CSS：

a:nth-child(1) {    color:red;}a:nth-child(3) {    color:gray;}

解决方法 使用 nth-of-type()而不是 nth-child(),如果你删除< br />,它将完美地工作标签,因为@FritsvanCampen评论它是一个孩子

a:nth-of-type(1) {    color:red;}a:nth-of-type(3) {    color:gray;}

为了更好地理解参考：http://css-tricks.com/the-difference-between-nth-child-and-nth-of-type/

Fiddle

总结

以上是内存溢出为你收集整理的html – CSS nth-child错过了元素全部内容，希望文章能够帮你解决html – CSS nth-child错过了元素所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。