元素和子元素的 LESS 选择器？

Question

使用 LESS 如何将样式应用于选择器和其中的选择器？

我的演示我需要将不透明度和 z-index 应用于 class a，并在它后面直接添加标签。

.a {
  color: red;
  opacity: 0.9;
  z-index: 2;
  & + label {
    color: blue;
    opacity: 0.9;
    z-index: 2;
  }
}

Answer 1

这里是完整的答案，以帮助有同样疑问的人。为了达到预期的效果，原代码可以变成：

解决方案 1：

.a 
{
  &,
  & + label
  {
    color: red;
    opacity: 0.9;
    z-index: 2;
  }

  & + label
  {
    color: blue;
  }
}

首先，您使用 , 分隔符为两个选择器定义公共属性，然后您将仅覆盖 color 属性一个 & + label。

解决方案 2：

如果你愿意，你可以先使用 class .a 作为 mixin 然后再次覆盖 color 属性:

来获得相同的结果

.a
{
  color: red;
  opacity: 0.9;
  z-index: 2;
}

a + label
{
  .a;
  color: blue;
}

LESS selector for element and child?