0

我正在为 Kaplan 网站测试制作一个黑暗模式，这样我就不会盲目地学习。

以下 HTML 代码代表了源代码的结构，带有 id="stylish-23" 的标签是 chrome 扩展添加的，用于更改页面的 CSS 样式：

<html> // html 1
  <html> // html 2
    <html> // html 3
      <html> // html 4
        <div id="divQuestions"> </div> //actual tag I want to change
      </html> // html 4
    </html> // html 3
  </html> // html 2
  <style id="stylish-23" type="text/css">...</style>
</html> // html 1

我放入div#divQuestions了样式标签的 CSS，它似乎根本没有任何效果。由于扩展的性质和限制，我只能将 CSS 添加到样式标签，而 CSS 似乎无法选择 HTML 标签（或者至少当我这样做时，什么也没有发生）。我注意到在开发者控制台中将样式标签拖到 html #4 中会正确应用 CSS。

有问题的元素来自检查的 CSS： 有问题的元素的 CSS 来自检查

我在样式标签中的 CSS：

div#divQuestions {
  background: black;
}

谢谢您的帮助！

4

2 回答 2

1

#divQuestions如果我修复了 div 的结束标签（或者即使我没有，事实证明），选择器对我有用：

<html>
  <html>
    <html>
      <html>
        <div id="divQuestions"> </div>
      </html>
    </html>
  </html>
  <style id="stylish-23" type="text/css">
    #divQuestions {
      padding: 48px;
      background: aliceblue;
      border: 4px solid blue;
    }
  </style>
</html>

于 2020-07-19T01:32:34.503 回答
0

nth-of-type是一个匹配其“类型”的第 n 个元素的选择器。
所以，你可以这样做：

html:nth-of-type(1)
html:nth-of-type(2)
html:nth-of-type(3)
...

或者，您可以这样做，因为您说过“多个嵌套标签”：

html
html > html
html > html > html
...
于 2020-07-19T01:29:58.003 回答