ざっくりとどういうものかの覚え書き。
Bootstrap 3.0入門 (全18回) - プログラミングならドットインストール ←具体的な内容についてはこちらへ。
その後、使う場合は公式ページにサンプルなど揃ってます。Bootstrap · The world's most popular mobile-first and responsive front-end framework.
Bootstrapは何をするものか
Webページを構築するときに、よく使うデザインやユーザーインターフェース、画面サイズの違いによるデザイン変更(レスポンシブ)などを提供してくれるもの。
インストール方法
公式ページからデータをダウンロードすると、CSS、組み込みフォント、JavaScriptが入っているフォルダが入手できる。それらを自分のWebページから読める場所に置いて、HTMLから呼び出すだけ。何か特別なものをインストールする必要はない。
使い方
公式ページのサンプルに従って、必要なHTMLのヘッダと、CSSとJavaScriptの読み込みのタグを加える。
あとは、使いたい場所でclassなどにBootstrapで用意されているものを追加していくと自動的に反映されていく。
おおよその機能
- ヘッダ、ボディ、フッタなどのレイアウト
- 横方向のブロックを、12分割したグリッドで管理して、簡単にレイアウトできる
- Webブラウザの表示サイズに応じて個別のレイアウトを簡単に用意
- ラベルやボタン、テーブルなどの装飾
- パンくずリストやヘッダメニュー、コンボボックス、ボタンによるメニュー表示など
- アニメするプログレスバー
- モーダルウィンドウの制御
などなど。
要は、公式ページのようなページをclassへの要素の追加と、ちょっとしたJavaScriptの呼び出しだけで構築することができる。
