@ Bootstrap

Bootstrapの入手

Bootstrap の入手と配置

1)最新の alpha 版は https://v4-alpha.getbootstrap.com/ らからダウンロードできます。

2) Download ページが開くので、[ Bootstrapをダウンロード ] をクリックします。
CSS ファイルや JavaScript ファイルなど一式が、ZIP形式のファイルとしてダウンロードできます。

3) ZIPファイル展開後のファイル構成は以下のようになります。

bootstrap-4.0.0-alpha.6-dist/
├── css/
│   ├── bootstrap-flex.css
│   ├── bootstrap-flex.css.map
│   ├── bootstrap-flex.min.css
│   ├── bootstrap-flex.min.css.map
│   ├── bootstrap-grid.css
│   ├── bootstrap-grid.css.map
│   ├── bootstrap-grid.min.css
│   ├── bootstrap-grid.min.css.map
│   ├── bootstrap-reboot.css
│   ├── bootstrap-reboot.css.map
│   ├── bootstrap-reboot.min.css
│   ├── bootstrap-reboot.min.css.map
│   ├── bootstrap.css
│   ├── bootstrap.css.map
│   ├── bootstrap.min.css
│   └── bootstrap.min.css.map
└── js/
    ├── bootstrap.js
    └── bootstrap.min.js

cssディレクトリ

css ディレクトリには、CSSファイルが格納されています。

bootstrap.css と bootstrap.min.css はBootstrap の中枢のファイルで、必須です。
bootstrap.css と bootstrap.min.css はどちらも同じ内容で、通常は、空白や改行などを詰めてファイルサイズを小さくした bootstrap.min.css を使います。

jsディレクトリ

js ディレクトリには、JavaScript ファイルが格納されています。JavaScript を用いたコンポーネントを使わないときには必要ありませんが、特に理由がない限りは、インクルードするようにします。bootstrap.js と bootstrap.min.js は、どちらも同じ内容で、通常は、空白や改行などを詰めてファイルサイズを小さくした bootstrap.min.js を使います。

jQueryの入手

Bootstrap の JavaScript は、jQuery を必要とします。

jQuery の Webサイトを訪れ、[ Download jQuery ] のリンクをクリックすると、jQuery をダウンロードできます。

Tetherの入手

Bootstrap の JavaScript は、tether.js を必要とします。

Tether の Webサイトを訪れ、[ Download ZIP (v1.3.3) ] のリンクをクリックすると、Tether をダウンロードできます。

Bootstrap のライブラリー構成例

Bootstrap のライブラリー構成例を以下に示します。

bootstrap/
├── css/
│   └── bootstrap.min.css
└── js/
    ├── bootstrap.min.js
    ├── jquery.min.js
    └── tether.min.js