使用nth-child

Question

我有这个：

a {
    display:table;
}

a:hover {
    text-decoration:none;
}

a:first-child {
    color:#00FF00; /* green */
}

a:nth-child(3) {     
    color:#FF0000; /* red */
}

<a href="www.google.com">Google<a>
<a href="www.google.com">Google<a>
<a href="www.google.com">Google<a>		

问题： 为什么第二个“谷歌”红色而不是第三个？这是怎么回事？

Answer 1

关闭achor标签

HTML

<a href="www.google.com">Google</a>
<a href="www.google.com">Google</a>
<a href="www.google.com">Google</a>  

http://jsfiddle.net/vasanthanvas/z569bm6w/

Answer 2

关闭</a>

*{
    padding: 0;
    margin: 0;
}


a {

    display:block;
}
a:hover {

 text-decoration:none;

}

a:first-child {
 color:#00FF00;
}
a:nth-child(3) {     
 color:#FF0000;      
}

<a href="www.google.com">Google</a>
<a href="www.google.com">Google</a>
<a href="www.google.com">Google</a>  

Answer 3

You can check this on : https://jsfiddle.net/4k5f03yq/

It can't find the nth-child. Because a tag not close.