css - 为什么我的填充物不只从第一个 child 身上移除

Question

我的 A:hover 标签的第一个 child 正在删除所有填充，而不是仅删除第一个 child 。是什么原因造成的？感谢大家的帮助。 Stackoverflow 需要更多文本，但我只能说我的元素选择可能有问题。

     <nav>
            <h2>Navigation</h2>
            <ul>
                    <li><a href="">Home</a></li>
                    <li><a href="">Foo</a></li>
                    <li><a href="">Roo</a></li>
                    <li><a href="">Gamen</a></li>
                    <li><a href="">puta</a></li>
            </ul>
        </nav>
___________________________________________________________________________


    nav li{
        list-style-type:none;
        padding:10px 0px;
        font-size:20px;
        float:left;

    }

    nav h2{
        text-indent: -10000px;
    }
    .Latest_Content{
        clear:both;
    }

    nav a{
        text-decoration:none;
        padding:10px 20px 10px 20px;
        color:#000000;
        font-family:'Droid Sans', sans-serif; 

     }
    nav a:hover{
        color:#ffffff;
        background-color:#42b84f;
        padding:10px 20px 10px 20px;
        -webkit-transition: 0.4s;

    }

    nav a:first-child:hover {
        padding-left:0px;

    }

Answer 1

a:first-child 将从所有列表中选择所有第一个子元素。

应该是:

nav li:first-child a:hover{
  padding-left: 0;
}

现在，您只选择第一个列表的标签。