bootstrap-flex,bootstrap-grid和bootstrap-reboot之间的区别

时间:2016-11-27 09:00:00

标签: css angular bootstrap-4 twitter-bootstrap-4 ng-bootstrap

在最新版本的Bootstrap中(当提出问题的当前版本为bootstrap@4.0.0-alpha.5)时,有3个不同的文件和标准文件:

  1. 自举-flex.css
  2. 自举-grid.css
  3. 自举-reboot.css
  4. bootstrap.css
  5. 前3个文件是bootstrap.css(#4)的扩展吗?

    我可以想象,bootstrap-flex使用CSS Flexbox的功能,bootstrap-grid可能是旧的且已经存在的方式,但是bootstrap-reboot呢?

    我必须包含哪一个(特别是如果我将ng-bootstrap与Angular 2一起使用)?

2 个答案:

答案 0 :(得分:6)

查看source

<强> bootstrap-flex.scss

  

启用Flexbox的Bootstrap

     

包括标准Bootstrap项目的所有导入,但启用了flexbox变量。

<强> bootstrap-grid.scss

  

仅限Bootstrap网格

     

包括常规(非flexbox)网格系统的相关变量和mixins,以及生成的预定义类(例如.col-4-sm)。

<强> bootstrap-reboot.scss

  

仅限Bootstrap重启

     

仅包括Normalize和我们的自定义重启重置。

<强> bootstrap.scss

  

主要的Bootstrap库

答案是肯定的,前三个文件对于Bootstrap是可选的。

所需的最低要求为bootstrap.css,已包含bootstrap-reboot

如果只需要Bootstrap的网格,请替换为bootstrap-grid

如果要在Flexbox中使用Bootstrap,请替换为bootstrap-flex。具有Flexbox功能的bootstrap.css

答案 1 :(得分:0)

正如@Nhan所说:是的,-reboot,-flex和-grid文件扩展了主bootstrap.css,如果您使用其中一个,那么该文件是您需要包含的唯一文件。

就问题的ng-bootstrap部分而言,我使用的是同一个而且我只包含了bootstrap.min文件,因为我不打算使用flexbox而且我需要不仅仅是网格样式。

希望在你的问题的背景下增加一些关于什么是绝对必要的澄清。