仅对 gien 子元素应用 css 样式

apply css style only by gien child elements


我想知道您是否可以设置样式,例如,仅当另一个 ul 紧随其后时,才可以设置 li 标签的样式。 (ul 和 li 只是例子)
有给定的方法吗?或者您是否必须解决 javascript 的问题?

例如:

<ul>
    <li>one</li> <- style this one
    <li>two</li> <- also this one
    <li>tree</li> <- but not this one, because no other li follows
</ul>

我想你只能通过将最后一个元素的样式覆盖回默认样式来做到这一点

例如:

li {
    background: #000000f0;
}

li:last-child {
    background: none;
}

你猜对了,使用 li:last-child 就可以了。 或者你可以用类似的东西让你的生活复杂化:

li::not(:last-child)

您不必重新设计最后一个元素的样式,因为知道样式是什么并重复它很复杂。

你可以使用非伪class

li:not(:last-child) {
  background: #000000f0;
}