《Bootstrap前端開發（全案例微課版）》是2021年清華大學出版社出版的圖書。
基本介紹
- 中文名：Bootstrap前端開發（全案例微課版）
- 作者：劉榮英
- 出版社：清華大學出版社
- 出版時間：2021年8月1日
- 定價：78 元
- ISBN： 9787302588184
內容簡介,作者簡介,圖書目錄,
內容簡介
《Bootstrap前端開發（全案例微課版）》是針對零基礎讀者研發的網站前端開發入門教材。該書側重案例實訓，並提供掃碼微課來講解當前的熱點案例。
《Bootstrap前端開發（全案例微課版）》分為17章，內容包括快速進入Bootstrap世界、回響式網頁設計、深入掌握Bootstrap基本架構、精通頁面排版、回響式新布局——彈性盒子、核心框架—CSS通用樣式、認識CSS組件、精通CSS組件、高級的CSS組件、玩轉卡片和旋轉器、認識JavaScript外掛程式、精通JavaScript外掛程式。最後通過5個熱點綜合項目，進一步幫助讀者鞏固項目開發經驗。
《Bootstrap前端開發（全案例微課版）》通過精選熱點案例，可以讓初學者快速掌握網站前端開發技術。通過微信掃碼看視頻，可以隨時在移動端學習技能對應的視頻操作。通過實戰技能訓練營可以檢驗讀者的學習情況，為此還提供了掃碼看答案。本書還提供技術支持QQ群和微信群，專為讀者答疑解惑，降低零基礎學習網站前端開發技術的門檻。
作者簡介
劉榮英老師負責計算機系的畢業生項目實訓，擅長網站前端開發技術，包括HTML5、CSS3、JavaScript和前端框架（Bootstrap和Vue.js）。善於引導學生學習，讓學校所學的知識和社會的需求很好地銜接，同時具有豐富的教學經驗和開發經驗。曾做過電子貨幣交易系統、 B2C 電子商務平台和眾多企業網站等項目。
圖書目錄
第 1章 快速進入Bootstrap世界001
1.1 認識 Bootstrap 002
1.1.1 Bootstrap 的由來 002
1.1.2 Bootstrap 的構成模組 003
1.2 Bootstrap 的優勢 004
1.3 下載 Bootstrap 005
1.4 安裝 Bootstrap 006
1.4.1 本地安裝 006
1.4.2 線上安裝 007
1.5 Bootstrap 的線上開發工具 007
1.6 小試身手—設計輪播圖效果 008
1.7 新手常見疑難問題009
1.8 實戰技能訓練營 010
第 2章 回響式網頁設計011
2.1 什麼是回響式網頁設計 012
2.2 像素和螢幕解析度013
2.3 視口013
2.3.1 視口的分類和常用屬性 013
2.3.2 媒體查詢 014
2.4 回響式網頁的布局設計 015
2.4.1 常用布局類型015
2.4.2 布局的實現方式 015
2.4.3 回響式布局的設計與實現 016
2.5 回響式圖片 016
2.5.1 使用 <picture> 標籤 016
2.5.2 使用 CSS 圖片017
2.6 回響式視頻 018
2.7 回響式導航選單 019
2.8 回響式表格 020
2.8.1 隱藏表格中的列 020
2.8.2 滾動表格中的列 022
2.8.3 轉換表格中的列 023
2.9 新手常見疑難問題025
2.10 實戰技能訓練營 025
第 3章 深入掌握Bootstrap 基本架構027
3.1 認識 Bootstrap 結構 028
3.1.1 源碼版 Bootstrap檔案結構 028
3.1.2 編譯版 Bootstrap 檔案結構 029
3.2 布局基礎 029
3.2.1 布局容器 029
3.2.2 回響斷點 031
3.2.3 z-index031
3.3 格線系統 031
3.3.1 格線選項 031
3.3.2 自動布局列 032
3.3.3 回響類035
3.3.4 重排序037
3.3.5 列嵌套040
3.4 布局工具類 041
3.4.1 display 塊屬性定義 041
3.4.2 Flexbox 選項 041
3.4.3 外邊距和內邊距 041
3.4.4 切換顯示和隱藏 041
3.5 設計 QQ 登錄界面041
3.6 開發電商網站特效044
3.7 新手常見疑難問題046
3.8 實戰技能訓練營 046
第4 章 精通頁面排版048
4.1 頁面排版的初始化049
4.2 最佳化頁面排版 050
4.2.1 標題 050
4.2.2 段落 053
4.2.3 強調 054
4.2.4 縮略語055
4.2.5 引用 055
4.3 顯示代碼 056
4.3.1 行內代碼 056
4.3.2 多行代碼塊 057
4.4 回響式圖片 057
4.4.1 圖像的同步縮放 057
4.4.2 圖像縮略圖 058
4.4.3 圖像對齊方式058
4.5 最佳化表格的樣式 059
4.5.1 表格默認風格059
4.5.2 為表格設計個性化風格 060
4.6 設計商品管理系統頁面 063
4.7 新手常見疑難問題065
4.8 實戰技能訓練營 065
第5 章 回響式新布局—彈性盒子066
5.1 定義彈性盒子 067
5.2 排列方向 068
5.2.1 水平方向排列068
5.2.2 垂直方向排列069
5.3 內容排列布局 069
5.4 項目對齊布局 070
5.5 自動對齊布局 071
5.6 自動相等布局 072
5.7 等寬變換布局 073
5.8 自動浮動布局 074
5.8.1 水平方向浮動布局 074
5.8.2 垂直方向浮動布局 074
5.9 彈性布局—包裹075
5.10 排列順序布局 076
5.11 對齊內容布局 077
5.12 新手常見疑難問題 078
5.13 實戰技能訓練營 078
第6 章 核心框架—CSS 通用樣式 079
6.1 文本處理 080
6.1.1 文本對齊 080
6.1.2 文本換行 081
6.1.3 轉換大小寫 082
6.1.4 粗細和斜體 083
6.1.5 其他文本樣式類 083
6.2 顏色樣式 084
6.2.1 文本顏色 084
6.2.2 連結顏色 085
6.2.3 背景顏色 086
6.3 框線樣式 087
6.3.1 添加框線 087
6.3.2 框線顏色 088
6.3.3 圓角框線 089
6.4 寬度和高度 090
6.4.1 相對於父元素090
6.4.2 相對於視口 092
6.5 邊距093
6.5.1 邊距的定義 093
6.5.2 回響式邊距 094
6.6 浮動樣式 094
6.6.1 實現浮動樣式094
6.6.2 回響式浮動樣式 095
6.7 display 屬性 096
6.7.1 隱藏或顯示元素 096
6.7.2 回響式地隱藏或顯示元素 097
6.8 嵌入網頁元素 098
6.9 內容溢出 099
6.10 定位網頁元素 099
6.11 陰影效果 101
6.12 新手常見疑難問題 101
6.13 實戰技能訓練營 102
第7 章 認識CSS 組件103
7.1 正確使用CSS 組件 104
7.2 按鈕105
7.2.1 定義按鈕 105
7.2.2 設計按鈕風格106
7.3 按鈕組 108
7.3.1 定義按鈕組 109
7.3.2 定義按鈕組工具列 109
7.3.3 設計按鈕組布局和樣式 110
7.4 下拉選單 112
7.4.1 定義下拉選單112
7.4.2 設計下拉按鈕的樣式 114
7.4.3 設計下拉選單的樣式 115
7.5 導航組件 118
7.5.1 定義導航 118
7.5.2 設計導航的布局 119
7.5.3 設計導航的風格 121
7.5.4 設計導航選項卡 124
7.6 超大螢幕 126
7.6.1 定義超大螢幕126
7.6.2 設計風格 126
7.7 新手常見疑難問題127
7.8 實戰技能訓練營 127
第8 章 精通CSS 組件129
8.1 徽章130
8.1.1 定義徽章 130
8.1.2 設定顏色 131
8.1.3 橢圓形徽章 132
8.1.4 連結徽章 132
8.2 警告框 133
8.2.1 定義警告框 133
8.2.2 添加連結顏色134
8.2.3 額外附加內容135
8.2.4 關閉警告框 135
8.3 媒體對象 136
8.3.1 媒體版式 136
8.3.2 媒體嵌套 137
8.3.3 對齊方式 137
8.3.4 排列順序 138
8.3.5 媒體列表 139
8.4 進度條 140
8.4.1 定義進度條 140
8.4.2 設計進度條樣式 140
8.4.3 設計進度條風格 142
8.5 導航欄 143
8.5.1 定義導航欄 144
8.5.2 定位導航欄 147
8.5.3 設計導航欄的顏色 148
8.6 新手常見疑難問題149
8.7 實戰技能訓練營 150
第9 章 高級的CSS 組件 151
9.1 表單152
9.1.1 定義表單控制項152
9.1.2 設計單選按鈕/ 複選框布局和樣式 154
9.1.3 表單布局風格156
9.1.4 幫助文本 158
9.1.5 禁用表單 159
9.2 列表組 160
9.2.1 定義列表組 160
9.2.2 設計列表組的風格樣式 160
9.2.3 定製內容 162
9.3 麵包屑 163
9.3.1 定義麵包屑 163
9.3.2 設計分隔設定 164
9.4 分頁效果 165
9.4.1 定義分頁 165
9.4.2 使用圖示 166
9.4.3 設計分頁風格166
9.5 新手常見疑難問題169
9.6 實戰技能訓練營 170
第10 章 玩轉卡片和旋轉器171
10.1 卡片內容 172
10.1.1 卡片的標題、主體、文本和超連結 172
10.1.2 卡片中的圖片172
10.1.3 卡片的列表組173
10.1.4 卡片的頁眉和頁腳 173
10.2 控制卡片的寬度 174
10.2.1 使用格線系統控制卡片的寬度174
10.2.2 使用寬度類控制卡片的寬度 175
10.2.3 使用CSS 樣式控制卡片的寬度175
10.3 卡片中文本的對齊方式 176
10.4 卡片中添加導航 176
10.5 設計卡片的風格 178
10.5.1 設定卡片的背景顏色 178
10.5.2 設定背景圖像178
10.5.3 設定卡片的框線顏色 179
10.5.4 設計卡片的樣式 180
10.6 卡片排版 180
10.7 旋轉器 183
10.7.1 定義旋轉器 183
10.7.2 設計旋轉器風格 183
10.7.3 設定旋轉器的對齊方式185
10.7.4 按鈕旋轉器 186
10.8 新手常見疑難問題 187
10.9 實戰技能訓練營 188
第11 章 認識JavaScript 外掛程式 189
11.1 外掛程式概述 190
11.1.1 外掛程式分類 190
11.1.2 安裝外掛程式 190
11.1.3 調用外掛程式 191
11.1.4 事件 192
11.2 模態框 192
11.2.1 定義模態框 192
11.2.2 模態框布局和樣式 194
11.2.3 調用模態框 197
11.2.4 添加用戶行為198
11.3 下拉選單 199
11.3.1 調用下拉選單200
11.3.2 設定下拉選單201
11.3.3 添加用戶行為202
11.4 彈窗203
11.4.1 定義彈窗 203
11.4.2 彈窗方向 204
11.4.3 調用彈窗 205
11.4.4 添加用戶行為207
11.5 工具提示 208
11.5.1 定義工具提示209
11.5.2 工具提示方向210
11.5.3 調用工具提示210
11.5.4 添加用戶行為212
11.6 標籤頁 213
11.6.1 定義標籤頁 214
11.6.2 調用標籤頁 214
11.6.3 添加用戶行為215
11.7 新手常見疑難問題 217
11.8 實戰技能訓練營 217
第12 章 精通JavaScript 外掛程式 218
12.1 按鈕219
12.2 警告框 221
12.2.1 關閉警告框 222
12.2.2 添加用戶行為223
12.3 摺疊224
12.3.1 定義摺疊 224
12.3.2 控制多目標 225
12.3.3 設計手風琴 226
12.3.4 調用摺疊 227
12.3.5 添加用戶行為227
12.4 輪播228
12.4.1 定義輪播 228
12.4.2 設計輪播風格230
12.4.3 調用輪播 231
12.4.4 添加用戶行為233
12.5 滾動監聽 234
12.5.1 定義滾動監聽234
12.5.2 調用滾動監聽238
12.5.3 添加用戶行為239
12.6 新手常見疑難問題 240
12.7 實戰技能訓練營 240
第13 章 項目實訓1—開發企業入口網站 241
13.1 系統分析 242
13.2 系統設計 242
13.2.1 系統目標 242
13.2.2 系統功能結構242
13.2.3 資料夾組織結構 242
13.3 網頁預覽 243
13.3.1 網站首頁效果243
13.3.2 產品分類效果243
13.3.3 產品介紹效果244
13.3.4 新聞分類效果244
13.3.5 詳細新聞頁面244
13.4 項目代碼實現 244
13.4.1 網站首頁頁面代碼 244
13.4.2 圖片動態效果代碼 248
13.4.3 公司簡介頁面代碼 248
13.4.4 產品介紹頁面代碼 249
13.4.5 新聞中心頁面代碼 251
13.4.6 聯繫我們頁面代碼 252
13.5 項目總結 253
第14 章 項目實訓2—開發遊戲中心網站 254
14.1 網站概述 255
14.1.1 網站檔案的結構 255
14.1.2 排版架構 255
14.1.3 設計準備 255
14.2 項目代碼實現 256
14.2.1 設計遊戲中心網站的首頁 256
14.2.2 設計遊戲列表頁面 262
14.2.3 設計遊戲評論頁面 263
14.2.4 設計遊戲新聞頁面 264
14.2.5 設計遊戲部落格頁面 264
14.2.6 設計聯繫我們頁面 266
第15 章 項目實訓3—開發連鎖咖啡網站 267
15.1 網站概述 268
15.1.1 網站結構 268
15.1.2 設計效果 268
15.1.3 設計準備 269
15.2 設計首頁布局 269
15.3 設計可切換導航 270
15.4 主體內容 273
15.4.1 設計輪播廣告區 273
15.4.2 設計產品推薦區 274
15.4.3 設計登錄註冊和Logo 275
15.4.4 設計特色展示區 275
15.4.5 設計產品生產流程區 276
15.5 設計底部隱藏導航 277
第16 章 項目實訓4—開發網上商城式網站279
16.1 系統分析 280
16.2 系統設計 280
16.2.1 系統目標 280
16.2.2 系統功能結構280
16.2.3 資料夾組織結構 280
16.3 網頁預覽 281
16.3.1 網站首頁效果281
16.3.2 關於我們效果281
16.3.3 商品展示效果281
16.3.4 商品詳情效果282
16.3.5 購物車效果 282
16.3.6 品牌故事效果282
16.3.7 用戶登錄效果282
16.3.8 用戶註冊效果282
16.4 項目代碼實現 282
16.4.1 首頁頁面代碼282
16.4.2 動態效果代碼293
16.4.3 購物車代碼 294
16.4.4 登錄頁面代碼296
16.4.5 商品展示頁面代碼 296
16.4.6 聯繫我們頁面代碼 301
16.5 項目總結 302
第17 章 項目實訓5—開發房產企業網站 303
17.1 網站概述 304
17.1.1 網站結構 304
17.1.2 設計效果 304
17.1.3 設計準備 305
17.2 設計主頁 305
17.2.1 主頁布局 305
17.2.2 設計導航條 306
17.2.3 設計輪播廣告308
17.2.4 設計功能區 309
17.2.5 設計特色展示310
17.2.6 設計腳註 313
17.3 設計側邊導航欄 314
17.4 設計登錄頁316
