css - 使用 CSS 在树中选择父 n 层？

Question

我有一个具有 20 多个 div 层的 DOM 结构相对复杂的应用程序。

如果我在树中间的某个地方有一个 div，class="active"我如何使用 CSS 在树中选择它的父n层？

例如，如何在以下树中选择以大写（向上 4 层）标记的 div？：

<DIV>
  <div>
    <div>
      <div>
        <div class="active">
        </div>
      </div>
      <div>
      </div>
    </div>
  </div>
</DIV>

同样考虑第一个孩子？如何选择树下的第一个子n层？

score 2 · Accepted Answer

不幸的是，没有父选择器之类的东西。您必须直接在所需元素上设置一个类，可以手动设置，也可以使用一些服务器端代码，或者通过 JavaScript。

score 0 · Accepted Answer

根据这篇文章，我发现标题为CSS4 Preview，可以在 CSS4 中设置父元素的样式。该文章表明，可以像下面这样设置父元素的样式：

$div > div > div > div.active { border: 1px solid #ccc; }

div（给定示例将在树中设置嵌套的 3 层样式div.active）

回到我的应用程序，使用 PHP 和内联 CSS，我将能够控制n（嵌套深度）。

在 CSS4 之前，我将使用某种 jQuery 解决方案。

2 回答 2