选择器不是直接子元素

问题描述 投票:4回答:3

谁能告诉我什么是选择器,用于查找父元素内的元素,但不是直接的子元素。例:

<body class="main">
  <p class="text">Hello</p> <!-- don't select this one -->
  <elem class="something">
    <elem id="link">
      <elem class="otherclass">
        <p class="text">Hello</p> <!-- but this one -->
      </elem>
    </elem>
  </elem>
</body>

所以我想通过.text找到.main而不知道中间和纯CSS之间的元素数量。

谢谢

html css
3个回答
5
投票

您可以使用以下选择器:

.main > * .text

这将选择所有.text元素,这些元素是.main的后代,但不是直接的孩子。


2
投票

以下将选择任何.text,这是.main的孩子。

CSS:

.main .text {
    background-color: red;
}

的jsfiddle:http://jsfiddle.net/3f20ojt8/


1
投票

您可以简单地使用所有客户端元素:

.main .text
{
/*css*/
}

DEMO

为了避免后代元素(中间孩子)你应该添加*之间喜欢:

.main * .text
{
/*css*/
}

Featured DEMO

© www.soinside.com 2019 - 2024. All rights reserved.