定制化 Twitter Bootstrap 类名

Question

http://getbootstrap.com/customize/

上面的链接可以自定义Bootstrap的组件、Less变量和jQuery插件，以获得您自己的版本。

我想知道是否可以通过添加前缀来自定义Bootstrap的类，例如：

".container" = ".myid_container"
".btn-group" = ".myid_btn-group"

- alyssaeliyah

---

你可以相对容易地编写一个CSS后处理器（使用类似postcss的工具）来完成这种操作。Bootstrap自定义页面本身无法做到这一点。请注意，您还需要对Bootstrap的JavaScript进行相应的更改。 - cvrebert

Answer 1

如果你使用sass，你可以@extend bootstrap类并将它们命名为任何你想要的名称。这里有相关信息http://www.sitepoint.com/sass-semantically-extend-bootstrap/。但是如果你使用普通的bootstrap.css，我不确定是否有一种重命名bootstrap类的方法，除非在文件中重命名它们。

- iurii

Answer 2

我知道这是一个老问题，但这可能会对从搜索引擎来到这里的人有所帮助 - 您可以在scss中执行以下操作以实现上述效果：

// allows this file to use bootstrap classes and functions
@forward "node_modules/bootstrap/scss/bootstrap";

.myid_container{
  @extend .container;
}

.myid_btn-group{
  @extend .btn-group;
}

- Kingo

Answer 3

只需打开任何编辑器中的Bootstrap CSS文件，然后使用“查找和替换”（在Notepad++中按Ctrl + H）将所有'.'替换为'.myid_'。

- AndrewL64