继承位于另一个文件中的 css 类答案

【问题标题】：Inheriting css class which is located in another file继承位于另一个文件中的 css 类
【发布时间】：2015-08-02 23:15:46
【问题描述】：

我正在使用引导程序和更少。

我希望我的一个类继承自引导类。问题是我正在使用来自 cdn 的引导程序，并且不想在本地拥有任何引导程序文件。

是否可以使用less从cdn文件中导入css类或继承文件中没有的类？

【问题讨论】：

是的，Less @import 可以很好地处理非本地文件：codepen（假设您了解导入 Bootstrap Less 源和 Bootstrap CSS 文件之间的区别）。
但是不管上面如何，它看起来仍然是一个奇怪的愿望（每次编译时都必须下载这个文件），所以根据你到底想要做什么，可能会有更好的方法。
@seven-phases-max 理想的方法是使用已经从 CDN 下载的引导类。问题是我们无法从另一个文件访问类。我无法在 main.css 文件中引用引导类 .form-control。
在我上面链接的代码笔中，这个作品。

【解决方案1】：

您无需安装任何东西。只需下载要使用的less文件from GitHub并导入即可：

@import (reference) "https://raw.githubusercontent.com/twbs/bootstrap/master/less/buttons.less";

但无论如何，我认为这不是一个好主意。每次编译时，Less 都必须请求该文件。

【讨论】：

谢谢，但我不想在本地有任何引导文件。我想从cdn下载所有这些（我编辑了我的帖子以清楚地说明它）。
@Moebius 您应该可以直接指定网址。我会更新答案。
谢谢，但它不起作用，ajax 请求生成错误：跨域请求被阻止：同源策略不允许读取raw.githubusercontent.com/twbs/bootstrap/master/less/forms.less 的远程资源。这可以通过将资源移动到同一域或启用 CORS 来解决。
@Moebius 那么你是在浏览器中编译 less 吗？这真的有必要吗？您也可以尝试使用 max cdn 中的通用 bootstrap.css 文件。
从 maxcdn 下载 bootstrap 不会产生任何错误，只是根本没有加载 bootstrap。

【解决方案2】：

该问题已由 7-phases-max 回答。

不支持通过 url 导入文件。您只需将其标记为 less 文件，如下所示：

@import (less) "//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.css";

Example here。然后就可以引用通过url导入的类了。

它正在工作，但继承引导类不会导入所有类功能。我用 .form-control 类继承了我的所有输入。导入的引导表单控件的某些功能（大小、圆角）和其他没有的功能（选择时会发出蓝光）。有关此here 的更多信息。

input[type="text"]{
    .form-control;
    width: 50%;
}

【讨论】：