使用Sass从选择器继承所有Bootstrap类

Question

我是Sass的新手，我想让所有的bootstrap.css类都有一个父ID，就像这样：

/*!
 * Bootstrap v3.3.7 (http://getbootstrap.com)
 * Copyright 2011-2016 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
#mycustomid html {
  font-family: sans-serif;
  -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
}
#mycustomid body {
  margin: 0;
}
#mycustomid article,
#mycustomid aside,
#mycustomid details,
#mycustomid figcaption,
#mycustomid figure,
#mycustomid footer,
#mycustomid header,
#mycustomid #mycustomid hgroup,
#mycustomid #mycustomid main,
#mycustomid #mycustomid menu,
#mycustomid #mycustomid nav,
#mycustomid #mycustomid section,
#mycustomid #mycustomid summary {
  display: block;
}
#mycustomid audio,
#mycustomid canvas,
#mycustomid progress,
#mycustomid video {
  display: inline-block;
  vertical-align: baseline;
}

我该如何使用Bootstrap Sass实现这个功能？

我从官方网站下载了完整的Bootstrap Sass。

我已经学会了如何使用gulp和bower编译它，但是我不知道应该在哪个文件中添加主要ID。

请查看我的文件图像

- ArtM

Answer 1

只需将 SCSS 文件的 @import 包装在您自定义的选择器中...

#mycustomid {
    @import "bootstrap";
}

请注意，#mycustomid元素需要包含整个文档：html、body等。

Codeply上的演示

- Carol Skelly

---

当你自定义Sass变量时（至少在Bootstrap 5.3中），似乎这个功能无法正常工作。 - Pierre de LESPINAY