【问题标题】:why does the pseudo selector on p not work? [duplicate]为什么 p 上的伪选择器不起作用? [复制]
【发布时间】:2021-05-16 11:06:41
【问题描述】:

我有一个包含 ul 的 div 标签,其中有 3 个 li 标签,其中有 p 和 h2。

除了第一个 li 之外,我无法设置所有 CSS 属性: 由于某种原因,在第一个 li 中,p 也发生了偏移。 .features li:not(:first-child) h2, p { margin-left: 94px; }

enter image description here

【问题讨论】:

  • 欢迎来到 Stackoverflow:记得使用 tour,阅读 posting topics 以获得 SO,并确保阅读 posting guidelines。在这种情况下,不要使用文本描述代码,而是显示 HTML(并且不要“手动重新编写”,当然,复制并粘贴您在页面源中实际看到的内容如果您在那里有任何拼写错误,那么您发布的代码中也会有拼写错误)。一般的发布方法是解释你需要什么,展示你写的代码,解释它是如何偏离预期的,并讨论你已经做过的调试。

标签: html css


【解决方案1】:

选择器中的逗号将其拆分如下:

.features li:not(:first-child) h2 p

您似乎希望它像这样拆分它:

.features li:not(:first-child) h2.features li:not(:first-child) p

CSS 没有允许这种速记的语法。你必须明确:

.features li:not(:first-child) h2,
.features li:not(:first-child) p { ... }

有一些预处理器可以提供更方便的语法。例如,如果您使用 SCSS 语法编写 SASS:

.features li:not(:first-child) {
    h2, p { ... }
}

【讨论】:

  • 非常感谢您的回答。一切正常。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-11-07
  • 1970-01-01
  • 1970-01-01
  • 2019-09-20
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多