web-dev-qa-db-ja.com

bootstrap-flex、bootstrap-grid、bootstrap-rebootの違い

Bootstrap(質問をしたときの現在のバージョンは[email protected])の最新バージョンには、3つの異なるファイルと標準のファイルがあります。

  1. bootstrap-flex.css
  2. bootstrap-grid.css
  3. bootstrap-reboot.css
  4. bootstrap.css

最初の3つのファイルはbootstrap.css(#4)の拡張子ですか?

bootstrap-flexはCSSFlexboxの機能を使用していると想像できますが、bootstrap-gridはおそらく古くて既存の方法ですが、bootstrap-rebootはどうでしょうか?

どれを含める必要がありますか(特に、 ng-bootstrap with Angular 2)を使用する場合)?

17
Lonely

ソース を見てください:

bootstrap-flex.scss

Flexboxが有効になっているブートストラップ

標準のBootstrapプロジェクトからのすべてのインポートが含まれますが、flexbox変数が有効になります。

bootstrap-grid.scss

ブートストラップグリッドのみ

通常の(フレックスボックスではない)グリッドシステムに関連する変数とミックスイン、および生成された事前定義されたクラス(.col-4-smなど)が含まれます。

bootstrap-reboot.scss

ブートストラップ再起動のみ

正規化とカスタム再起動リセットのみが含まれます。

bootstrap.scss

メインBootstrapライブラリ

そして答えはイエスです。最初の3つのファイルはBootstrapではオプションです。

最低限必要なのはbootstrap.cssで、すでにbootstrap-rebootが含まれています。

ブートストラップのグリッドのみが必要な場合は、bootstrap-gridに置き換えてください。

FlexboxでBootstrapを使用する場合は、bootstrap-flexに置き換えます。Flexbox機能を備えたbootstrap.cssです。

8
Nhan

@Nhanが言ったように:はい、-reboot、-flex、および-gridファイルはプライマリbootstrap.cssを拡張し、それらの1つを使用する場合は、そのファイルだけを含める必要があります。

あなたの質問のng-bootstrap部分に関しては、私は同じものを使用しており、flexboxを使用する予定がないため、bootstrap.minファイルのみを含めました。グリッドスタイル以上のもの。

うまくいけば、それはあなたの質問の文脈の中で厳密に必要なものについての少しの明確化を追加します。

0
Kate Sowles