css - LESS CSS - 选择与其父级具有相同类的子级

Question

今天刚开始使用 LESS...有一个问题我想弄清楚。
有没有办法将样式应用于与其父 UL 具有相同类名的 LI，无需事先知道该类名是什么？

例如，下面是一些 HTML:

<ul class="random-classname">
    <li class="foo">foo</li>
    <li class="random-classname">Select Me!</li>
    <li class="bar">bar</li>
</ul>

我想将背景颜色应用于第二个元素，而不在 CSS 中使用特定的类名称。

Answer 1

这只在一个非常特殊的用例中回答你的问题，我怀疑这不完全是你的用例(因为它仍然需要将类名放入CSS中，它只允许程序员可能会让另一个人分配它)。我在这里提供它只是因为其他人可能会觉得有用。

如果情况是在编译时知道“随机”名称，则可以将类名称设置为变量，然后像这样处理:

@randomName: random-classname; //set at compile time

.@{randomName} {
  straight-property: value;
  & > & {
    nested-property: value;
  }
}

这会产生:

.random-classname {
  straight-property: value;
}
.random-classname > .random-classname {
  nested-property: value;
}

如果正在构建某种类型的框架，或者在其他阶段根据用户输入通过 php 动态设置变量，则上述内容可能很有用。但我相信您希望在实际 输出 CSS 中找到一些“通用”解决方案，这(如评论所述)目前是不可能的，并且正如他们也指出的那样，javascript 是您在这种情况下的最佳选择一个案例。