html - 第 n 个 : child/of-type does not seem to work on my site

Question

我以为我有这个 nth-child 或 nth-of-type 的东西，但不知何故它似乎在我的网站上不起作用。我有 http://www.dateworld.co.za/并且需要第三个选项卡是红色背景，但不知何故这段代码似乎不起作用......

谁能帮帮我？

 div#headernav ul li a {
 padding: 0px 16px;
 height: 30px;
 display: block;
 float: left;
 font: bold 12px/30px arial, verdana, sans-serif;
 color: #ffffff;
 text-transform:uppercase;
 text-decoration: none;
 margin-right:6px;
 background-color:#2274D9;
 }

 div#headernav ul li a:nth-of-type(3){
 height: 30px;
 display: block;
 background-color:#ff0000;
 }

感谢和问候安东

Answer 1

您需要改用此选择器:

div#headernav ul li:nth-of-type(3) a

参见:http://jsfiddle.net/thirtydot/TJ6Lc/

此外，你不需要nth-of-type，你可以只使用nth-child:

div#headernav ul li:nth-child(3) a

http://jsfiddle.net/thirtydot/TJ6Lc/1/

---

您使用的选择器:

div#headernav ul li a:nth-of-type(3)

正在寻找 li 元素内的第三个 a 元素，这与您实际要查找的内容不符。