如何仅选择父元素？

时间：2018-08-28 08:18:36

标签： css css3 css-selectors

我只想选择父元素，但不能正确工作（或者我做得不好。）如何只选择父元素？

body > ul > li {
  color: green;
}
<body>
  <ul>
    <li>parent</li>
    <li>parent
      <ul>
        <li>child</li>
        <li>child</li>
      </ul>
    </li>
    <li>parent</li>
    <li>parent</li>
  </ul>
</body>

4 个答案:

答案 0 :(得分：3)

您正面临继承行为。您将颜色设置为仅父级，但子级也继承了此颜色。

enter image description here

您需要为孩子重置样式：

body > ul > li {
  color: green;
}
body > ul > li > ul {
  color:initial;
}
<body>
  <ul>
    <li>parent</li>
    <li>parent
      <ul>
        <li>child</li>
        <li>child</li>
      </ul>
    </li>
    <li>parent</li>
    <li>parent</li>
  </ul>
</body>

答案 1 :(得分：1)

内部<ul>从父级获取CSS。您需要覆盖此

body > ul > li {
  color: green;
}

body > ul > li ul {
    color: black;
}
<body>
  <ul>
    <li>parent</li>
    <li>parent
      <ul>
        <li>child</li>
        <li>child</li>
      </ul>
    </li>
    <li>parent</li>
    <li>parent</li>
  </ul>
</body>

答案 2 :(得分：1)

body > ul > li {
  color: green;
}

body > ul > li > ul {
    color: initial;
}
<body>
  <ul>
    <li>parent</li>
    <li>parent
      <ul>
        <li>child</li>
        <li>child</li>
      </ul>
    </li>
    <li>parent</li>
    <li>parent</li>
  </ul>
</body>

答案 3 :(得分：-2)

尝试

body  ul  li { color: green; }
相关问题
最新问题