Question

我正在创建一个使用Bootstrap的HTML / CSS页面。实际上我必须定制一些零件。由于几个原因，某些类名与Bootstrap中的原始名称不匹配。所以，我有两个文件。 bootstrap.min.css和main.less（=＆gt; main.min.css）。我想知道是否可以将main.less中的类与bootstrap.min.css匹配。所以，我有一个类.orderby（在main中）应该具有相同的设置然后.form-control（bootstrap）。像这样：

Here's the output:
 (null)

但我不知道如何引用另一个css文件。

如果有人能指出我正确的功能，我将不胜感激。谢谢！

Answer 1

您可以使用LESS的extend "all"执行此操作。通用表单是:extend(<indentifier> all) {}。在你的情况下，你做

.orderby {
    &:extend(.form-control all) {}
    <your additional styles>
}

此外，如果您不需要使用所有Bootstrap，则可以使用LESS reference导入您需要的位：

@import (reference) path/to/bootstrap

将其与上述扩展代码相结合，您只需引入Bootstrap .form-control。

少参考不同CSS文件中的类

1 个答案: