有没有办法在布局中继承 Bootstrap 类？ [关闭]答案

【问题标题】：Is there any way of inheriting Bootstrap classes in layouts? [closed]有没有办法在布局中继承 Bootstrap 类？ [关闭]
【发布时间】：2019-04-01 11:15:56
【问题描述】：

我正在调整一个网站以使用 Bootstrap。我想知道是否有任何方法可以使用它，这样我的 HTML 元素就不会被类弄得乱七八糟。

我想替换下面的代码：

<div class="row">
    <div class="hidden-xs col-sm-12 col-md-4 col-md-offset-1">
        Text
    </div>
</div>

类似的东西：

<div class="row">
    <div class="myClass">
        Text
    </div>
</div>

myClass 将继承 hidden-xs、col-sm-12、col-md-4 和 col-md-offset-1 类。

我一直在网上四处寻找是否有任何方法可以让我自己的自定义类“继承”引导类，这样我就可以尽可能地将样式保留在 CSS 中，但我找不到任何东西.如果不可能做到这一点，我不会感到惊讶，但有没有人有任何建议或任何关于如何使最终结果看起来尽可能干净的建议？

谢谢

【问题讨论】：

这个问题要么过于宽泛，要么基于观点，要么需要讨论，因此与 Stack Overflow 无关。如果您有具体的、可回答的编程问题，请提供完整的详细信息。
否 - 如果您想在每个设备上使用不同的宽度，那么您需要添加类。没有办法绕过它
您可能希望简化设计以实现跨设备的统一
这个问题的意见是如何建立的？他明确询问如何继承 css 类，这不是基于意见的。
@Rikudou_Senin 我同意这个问题并不是真正基于意见的，但它包含触发短语，例如 “在线环顾” 和 “有没有人有任何建议" 这可能会导致某些人认为它是。也许如果 OP 可以改写最后一段以删除聊天并仅关注要解决的问题，那么问题可能会重新打开。

标签： css twitter-bootstrap class

【解决方案1】：

直接在 CSS 中是不可能的（据我所知），但如果你切换到 sass (scss) 应该是可能的。

话虽如此，我不建议这样做，只需重复课程并完成它，这样每个人都可以第一眼就知道块的样子。

当你安装SASS时，你需要从他们的download page下载bootstrap的源文件并将scss目录解压到某个目录，例如bootstrap.

然后创建您自己的样式表，我们称之为style.scss（注意scss 扩展名）。

现在在您的style.scss：

@import "bootstrap/bootstrap";
@import "bootstrap/bootstrap-grid";

.myClass {
  @extend .col-sm-12;
  @extend .col-md-4;
  // extend any other classes here
}

然后你编译你的 scss 文件（读取sassdocumentation）并且你的myClass 将具有它扩展的类的所有属性。

如果您在阅读文档以了解其工作原理之前从未听说过 sass。

【讨论】：

这样做会给你的 css 文件增加大量的膨胀，所以你只是将膨胀从你的 html 转移到你的 css
我感觉是这样的，但感谢您的确认。而且我知道在这种情况下膨胀只会被转移，所以无论如何都没有什么意义。但是感谢您的回答，出于好奇，我可能只是稍微读了一下 SASS。
@Pete 是的，正如我所说，我建议不要这样做，但我只是想指出这实际上是可能的。
@James_P 肯定会研究 sass，你永远不会想回到纯 css，只是嵌套是值得的。