Bootstrap 4ファーストガイド
CSS設計の手間を大幅に削減！
- 著者 相澤 裕介
- 判型 B5判、384頁、フルカラー
- 本体価格 3,200円
- ダウンロードサービス：学習に使えるサンプルファイル
- ISBN 978-4-87783-432-6
本書について
BootstrapはCSSフレームワークと呼ばれるツールの一つで、自分でCSSを記述しなくても、見た目に優れたWebサイトを制作できるのが特長です。また、レスポンシブWebデザインに対応しているため、簡単な記述で「パソコン」と「モバイル」の両方に対応するWebサイトを制作できます。ボタンやナビゲーションなどのパーツを「スマートフォン向け」のデザインに仕上げることも簡単です。そのほか、ドロップダウンやカルーセルなど、Webサイトでよく見かける機能を手軽に実現できるJavaScriptも用意されています。
Bootstrapを使用するにあたって、特別な環境は何も必要ありません。BootstrapはCSSとJavaScriptで構成されているため、誰でも、どんなWebサーバーでも使用できます。もちろん、無償で使用することが可能です。 本書はBootstrap 4.1.0の使い方を解説した書籍です。旧バージョンのBootstrapを使ったことがある方は、「Bootstrap 4もすぐに使いこなせるだろう」と考えるかもしれません。確かに、全くの初心者よりは短期間で概要を把握できると思います。しかし、Bootstrapに慣れているが故にトラブルに陥ってしまう可能性もあります。
Bootstrap 4は、前バージョンから大幅に仕様が変更されています。特に、「ブレイクポイントの新設」と「フレックスボックス（display:flex）の採用」が、各クラスの動作（書式指定）に大きな影響を与えています。
過去の経験は「武器」にもなりますし、「トラブルの原因」にもなります。そこで、Bootstrap 3ユーザーに向けて、Bootstrap 3からの変更点も紹介しています。初心者の方だけでなく、経験のある方が「Bootstrap 4で変更された部分」を確認する際にも、本書が役に立つと思います。
目 次
- 第１章 Bootstrap 4の特長と導入
- 1.1 Bootstrapの特長
- 1.2 Bootstrap 4の導入
- 1.3 Bootstrapとクラス
- 1.4 Bootstrap導入後の変化
- 第２章 グリッドシステムを利用したページレイアウト
- 2.1 グリッドシステム
- 2.2 画面サイズに応じたレイアウト
- 2.3 印刷レイアウト
- 第３章 コンテンツの書式指定
- 3.1 文字と見出しの書式
- 3.2 リストの書式
- 3.3 画像の書式
- 3.4 ブロックレベル要素の書式
- 3.5 フレックスボックスの活用
- 3.6 テーブルの書式
- 3.7 カード
- 3.8 メディアオブジェクト
- 3.9 フォームの書式
- 第４章 ナビゲーションの作成
- 4.1 ボタンの書式
- 4.2 ナビゲーションの作成
- 4.3 ナビゲーションバーの作成
- 4.4 パンくずリストの作成
- 4.5 ページネーション
- 4.6 リストグループの作成
- 4.7 バッジの活用
- 第５章 JavaScriptを利用したコンテンツ
- 5.1 ドロップダウン
- 5.2 モーダルダイアログ
- 5.3 アラート
- 5.4 カルーセル
- 5.5 タブ切り替え
- 5.6 アコーディオン
- 5.7 ツールチップとポップオーバー
- 第６章 Bootstrapのカスタマイズ
- 6.1 テーマとテンプレート
- 6.2 カスタマイズサイトの活用
- 6.3 Sass を使ったカスタマイズ
- 付録 Bootstrap簡易リファレンス
- A.1 HTMLの雛形
- A.2 グリッドシステムとレスポンシブWebデザイン
- A.3 コンテンツの書式指定
- A.4 ナビゲーションの書式指定
- A.5 JavaScriptを利用したコンテンツ