Bootstrap 5 ファーストガイド
Web制作の手間を大幅に削減！
| 著者 | 相澤 裕介 |
|---|---|
| 判型 | B5判、400頁 |
| ISBN | 978-4-87783-522-4 |
| 価格 | 本体 3,300円 |
| 発行日 | 2022年4月25日（初版第1刷） |
本書について
レスポンシブWebデザインの構築は一朝一夕に習得できるものではなく、メディアクエリーの使い方を知っていても“それなりの経験”が求められます。このような場合にぜひ活用したいのが、本書で解説するBootstrapです。
Bootstrapは、一般的にフレームワークと呼ばれているツールで、自分でCSSを記述しなくても見た目に優れたWebサイトを制作できるのが特長です。レスポンシブWebデザインにも対応しているため、簡単な記述で「パソコン」と「モバイル」の両方に対応するWebサイトを制作できます。ボタンやナビゲーションなどを「スマートフォンでも操作しやすいデザイン」に仕上げることも簡単です。そのほか、ドロップダウンやカルーセル、オフキャンバスなど、Webサイトでよく見かける機能を手軽に実現するJavaScriptも用意されています。
Bootstrapを使用するにあたって、特別な環境を用意する必要はありません。BootstrapはCSSとJavaScriptで構成されているため、誰でも、どんなWebサーバーでも使用できます。もちろん、無償で使用することが可能です。
本書はBootstrap 5.1.3の使い方を解説した書籍です。Bootstrap 4の経験者に向けてBootstrap 4からの変更点も紹介しています。初心者の方はもちろん、経験のある方が「Bootstrap 5で変更された部分」を確認する際にも、本書が役に立つと思います。
フレームワークの概要を知り、Bootstrap 5を使ったWebサイトの制作方法を習得する。その一助として、本書を活用していただければ幸いです。
目次
- 第1章 Bootstrap 5の導入
- 1.1 Bootstrapの特長
- 1.2 Bootstrap 5の導入
- 1.3 Bootstrapとクラス
- 1.4 Bootstrap 導入後の変化
- 第2章 グリッドシステムを利用したページレイアウト
- 2.1 グリッドシステム
- 2.2 画面サイズに応じたレイアウト
- 第3章 コンテンツの書式指定
- 3.1 文字と見出しの書式
- 3.2 リストの書式
- 3.3 画像の書式
- 3.4 ブロック要素の書式
- 3.5 フレックスボックスの活用
- 3.6 テーブルの書式
- 3.7 アラートとカード
- 3.8 フォームの書式
- 第4章 ナビゲーションの作成
- 4.1 リンクとボタン
- 4.2 ナビゲーション
- 4.3 ナビゲーションバー
- 4.4 パンくずリスト
- 4.5 ページネーション
- 4.6 リストグループ
- 4.7 バッジ
- 第5章 JavaScriptを利用したコンポーネント
- 5.1 ドロップダウン
- 5.2 モーダルとアラート
- 5.3 カルーセル
- 5.4 タブ切り替え
- 5.5 アコーディオン
- 5.6 オフキャンバス
- 5.7 スクロールスパイ
- 5.8 ツールチップとポップオーバー
- 5.9 トースト
- 6.1 テーマとテンプレート
- 6.2 カスタマイズサイトの活用
- 6.3 CSSファイルのカスタマイズと圧縮版
- 6.4 Sassを使ったカスタマイズ
- 付録 Bootstrap簡易リファレンス
- A.1 HTMLの雛形
- A.2 グリッドシステムとレスポンシブWebデザイン
- A.3 コンテンツの書式指定
- A.4 ナビゲーションの書式指定
- A.5 JavaScriptを利用したコンポーネント