arthasno1
2021-04-18 12:33
采纳率: 83.3%
浏览 67

为什么nth-child(1)选择ul li 下面的a标签后会全部改变所有 ul li a的样式呢?

代码如下?这是为何呢?

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title></title>
        <style type="text/css">
            ul li a:nth-child(1) {
                color: yellow;
            }
        </style>
    </head>
    <body>
        <ul>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="#">3</a></li>
            <li><a href="#">4</a></li>
            <li><a href="#">5</a></li>
        </ul>
    </body>
</html>

  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

2条回答 默认 最新

  • 菜鸟咸鱼一锅端 2021-04-18 14:58
    已采纳

    这个nth-child(1)不应该放在a上,因为这样,每个li下的第一个a标签都会生效,改成

    ul li:nth-child(1) a {
         color: yellow;
      }
    已采纳该答案
    1 打赏 评论
  • 菜鸟咸鱼一锅端 2021-04-18 16:17
    打赏 评论

相关推荐 更多相似问题