如何匹配嵌套标签？

Question

我需要在pre类之下匹配long，就像在这里一样：

<div class="long highlight-text">
  <div class="highlight">
    <pre>
      some code
  </pre>
  </div>
</div>

我尝试过：long.highlight.pre - 但似乎没有效果。

Answer 1

从您的测试开始，您似乎也希望在选择器中包含.highlight，我建议使用此选项：

.long .highlight pre

或者如果你只是想“在长期课程中匹配pre”：

.long pre

a b中的空格表示b是a的后代。

这是the official documentation on CSS3 selectors。

Answer 2

您需要 ␣ combinator selector ，它指的是所有匹配的后代（不一定是直接的子项）：

.long pre

---

另请参阅此页面，描述 CSS selectors
或官方 CSS Selectors Reference 。

Answer 3

您应该使用：.long pre。并阅读http://www.w3schools.com/css3/default.asp了解详情。

Answer 4

尝试使用此选择器进行css

.long .highlight pre