问题如何使用less来定位类中的元素？

我想用less来定位类中的特定元素。

在这种情况下，我想要定位类的元素 button，但在其中我想要定位锚标签 a。

目前我有：

.button {
    /* lots of bits and pieces go here, hence 
    the need to keep it at a class level
    */


    /* further down, but still in .button */
    /* Attempt 1 - fails: compiled = a .button (note the space)
    a& {
         height:20px;
    }

    /* Attempt 2 - fails: compiled = .buttona
    &a {
        height:20px;
    }
}

我基本上希望它编译为：

a.button

这样我就可以创建如下元素：

<a class="button">
<button class="button">

但是当它成为一个锚时稍微改变它。我不想扔进去 it's a bug in less! 卡太早，但如果我使用 &.another-class 它按预期工作（编译： .button.another-class，但不是在定位元素时

12502

2018-01-05 07:11

起源

答案:

你使用的旧版本更少。下面的代码使用较少的1.3.3生成正确的CSS

.button {
 a& {
    height:20px;
  }
}

产生：

a.button {
  height: 20px;
}

2018-01-05 09:34

你是对的，我正在使用SimpLESS进行本地编译，似乎它只使用较少的v1.3.0（而不是1.3.3）。如果我直接使用该库（1.3.3），则修复了该错误。干杯 - Chris

答案:

你使用的旧版本更少。下面的代码使用较少的1.3.3生成正确的CSS

.button {
 a& {
    height:20px;
  }
}

产生：

a.button {
  height: 20px;
}

2018-01-05 09:34

你是对的，我正在使用SimpLESS进行本地编译，似乎它只使用较少的v1.3.0（而不是1.3.3）。如果我直接使用该库（1.3.3），则修复了该错误。干杯 - Chris

@Allen Bargi答案是正确的，但仅适用于此特定情况。我对你想要的东西感到有点困惑。

正如@Allen Bargi指出的那样，这将使用“按钮”类来定位“a”，并生成一个

.button {
 a& {
    height:20px;
  }
}

它产生：

a.button {
  height: 20px;
}

同时，下面的目标是“a”元素包含带有“按钮”类的元素。在我看来，这是你最初的目标。

.button {
 a {
    height:20px;
  }
}

它产生：

.button a {
    height:20px;
}

在这种情况下，两种解决方案migt工作正常，因为您对父元素和子元素使用相同的“按钮”类，但它们不针对相同的元素。

我希望这有帮助。

-1

2018-06-01 15:52

问题 如何使用less来定位类中的元素？

答案:

答案:

热门问题

问题如何使用less来定位类中的元素？