Bootstrap 響應式 Web 前端開發
王紅 秦海玉 侯勇
買這商品的人也買了...
-
$480$379
相關主題
商品描述
本書主要介紹Bootstrap的基礎知識、基本語法和高級應用,並採用易於理解的方式講解這些技術的使用技巧和註意事項。全書共14章,內容包括Bootstrap起步、Bootstrap中常用的基本樣式、Bootstrap 4彈性盒、Bootstrap網格佈局、Bootstrap表單、Bootstrap相關組件、Bootstrap徽章及加載動畫、Bootstrap中的圖文混排、設置Bootstrap中的公共樣式、Bootstrap的窗口和提示工具、折疊面板與輪播組件、第三方插件的使用、綜合案例——抖音秀、課程設計——吃了麽外賣網。全書每章內容都與實例緊密結合,有助於讀者理解並應用知識,進而達到學以致用的目的。
本書各章節主要內容配有以二維碼為入口的微課,並在人郵學院(www.rymooc.com)平臺上提供了慕課。此外,本書還提供了課程資源包,資源包中包含本書所有實例、上機指導、綜合案例的源代碼,製作精良的電子課件PPT,重點及難點教學視頻,自測題庫(包括選擇題、填空題、操作題題庫及自測試捲等內容),以及綜合案例和課程設計。其中,源代碼全部經過精心測試,能夠在Windows 7、Windows 8、Windows 10等操作系統下編譯和運行。
本書可作為高等院校電腦、軟件工程等專業“Web前端開發”相關課程的教材,也可作為程序開發人員的參考用書。
作者簡介
明日科技策划本书。
明日科技:已经在人民邮电出版社出版多本“程序设计类”图书,包括“技术方案宝典”、“开发技术大全”、“自学手册”、“参考大全”等多个系列,大都取得了比较好的市场反响,内容由浅入深,读者好评如潮。
目錄大綱
【章名目錄】
第 1章 Bootstrap起步 1
第 2章 Bootstrap中常用的基本樣式 8
第3章 Bootstrap 4彈性盒 37
第4章 Bootstrap網格佈局 69
第5章 Bootstrap表單 90
第6章 Bootstrap相關組件 117
第7章 Bootstrap徽章及加載動畫 135
第8章 Bootstrap中的圖文混排 148
第9章 設置Bootstrap中的公共樣式 166
第 10章 Bootstrap的窗口和提示工具 184
第 11章 折疊面板與輪播組件 218
第 12章 第三方插件的使用 240
第 13章 綜合案例——抖音秀 270
第 14章 課程設計——吃了麽外賣網 276
【詳細目錄】
第 1章 Bootstrap起步 1
1.1 Bootstrap概述 1
1.1.1 Bootstrap是什麽 1
1.1.2 Bootstrap版本的“進化” 1
1.2 為什麽使用Bootstrap 2
1.2.1 Bootstrap的優點 2
1.2.2 Bootstrap包含的內容 3
1.2.3 Bootstrap的應用 3
1.3 Bootstrap的下載及使用 3
1.3.1 Bootstrap的下載 3
1.3.2 Bootstrap的文件結構 4
1.3.3 Bootstrap的使用 5
1.4 本章小結 6
上機指導 7
習題 7
第 2章 Bootstrap中常用的基本樣式 8
2.1 排版樣式 8
2.1.1 標題樣式 8
2.1.2 添加強調文本 10
2.1.3 縮略語樣式 13
2.1.4 地址樣式 14
2.1.5 引用樣式 15
2.1.6 列表樣式 16
2.2 表格 20
2.2.1 基本的表格 20
2.2.2 可選的表格樣式 21
2.2.3 響應式表格 27
2.3 圖片 29
2.3.1 響應式圖片 29
2.3.2 修飾圖片 29
2.4 其他常用樣式 31
2.4.1 對文本的處理 31
2.4.2 背景樣式 32
2.4.3 設置內容間隔 33
2.4.4 添加陰影 35
2.5 本章小結 35
上機指導 35
習題 36
第3章 Bootstrap 4彈性盒 37
3.1 響應式設計概述 37
3.1.1 常見的佈局方式 38
3.1.2 佈局的實現方式 38
3.2 彈性盒概述 38
3.2.1 什麽是彈性盒 38
3.2.2 彈性盒的基本屬性 39
3.2.3 Bootstrap 4中彈性盒的使用 40
3.3 項目的對齊與對準 42
3.3.1 彈性盒的主軸方向 42
3.3.2 彈性子項目在主軸上的對齊方式 45
3.3.3 彈性子項目在側軸上的對齊方式 49
3.3.4 項目的自對齊 53
3.4 項目的大小 56
3.4.1 設置項目自相等 56
3.4.2 設置項目等寬變換 57
3.4.3 多行內容的對齊 59
3.5 項目的排列 61
3.5.1 設置項目自浮動 61
3.5.2 Wrap包裹 63
3.5.3 order排序 65
3.6 本章小結 67
上機指導 67
習題 68
第4章 Bootstrap網格佈局 69
4.1 網格系統概述 69
4.1.1 什麽是網格系統 69
4.1.2 網格化選項 70
4.1.3 網格系統的簡單應用 70
4.2 響應式的class選擇器 71
4.2.1 覆蓋所有設備 71
4.2.2 固定網格與流式網格 72
4.2.3 間隙的處理 73
4.3 自動佈局列 74
4.3.1 等寬佈局 74
4.3.2 自定義寬度 75
4.3.3 設置項目為寬度可變的彈性空間 77
4.3.4 混合佈局 78
4.4 項目的對齊處理 79
4.4.1 項目的水平對齊 80
4.4.2 項目的垂直對齊 80
4.4.3 自定義某列的垂直對齊方式 82
4.4.4 換行處理 82
4.5 列的偏移、嵌套和重排序 83
4.5.1 列的偏移 83
4.5.2 列的嵌套 86
4.5.3 列的重排序 87
4.6 本章小結 88
上機指導 89
習題 89
第5章 Bootstrap表單 90
5.1 表單的風格 90
5.1.1 表單支持的控件 90
5.1.2 控件的狀態 94
5.1.3 表單的佈局風格 95
5.2 下拉菜單 98
5.2.1 設置下拉菜單 98
5.2.2 下拉菜單內容設置 100
5.2.3 下拉菜單的狀態 102
5.3 下拉菜單樣式設置 103
5.3.1 下拉菜單的展開方向 103
5.3.2 下拉菜單的對齊方式 104
5.3.3 下拉菜單的響應式對齊 104
5.4 按鈕 105
5.4.1 按鈕的風格 105
5.4.2 按鈕的大小 108
5.4.3 按鈕的狀態 109
5.5 按鈕組 109
5.5.1 設置按鈕組 109
5.5.2 按鈕組的嵌套 110
5.5.3 垂直排列的按鈕組 111
5.6 輸入框組 111
5.6.1 定義輸入框組 112
5.6.2 輸入框組的樣式 112
5.7 本章小結 115
上機指導 115
習題 116
第6章 Bootstrap相關組件 117
6.1 導航菜單 117
6.1.1 導航菜單的基本樣式 117
6.1.2 導航菜單的對齊與填充 119
6.1.3 選項卡 121
6.2 導航欄 123
6.2.1 導航欄的內容組成 123
6.2.2 導航欄的樣式 125
6.2.3 響應式導航欄 127
6.3 麵包屑導航與分頁 129
6.3.1 麵包屑導航 129
6.3.2 設置分頁及其樣式 130
6.4 本章小結 133
上機指導 133
習題 134
第7章 Bootstrap徽章及加載動畫 135
7.1 添加徽章 135
7.1.1 徽章的基本使用 135
7.1.2 徽章的樣式 136
7.1.3 徽章的鏈接效果 138
7.2 進度條 138
7.2.1 進度條的基本使用 139
7.2.2 進度條的樣式 139
7.2.3 其他風格進度條 141
7.3 加載動畫 142
7.3.1 加載動畫及其樣式 142
7.3.2 設置加載動畫的位置 143
7.3.3 設置加載動畫的大小 145
7.3.4 在按鈕中添加加載動畫 145
7.4 本章小結 146
上機指導 146
習題 147
第8章 Bootstrap中的圖文混排 148
8.1 媒體對象 148
8.1.1 媒體對象的使用 148
8.1.2 媒體對象的樣式 149
8.1.3 媒體對象的嵌套 152
8.2 列表組 152
8.2.1 列表組的基本使用 152
8.2.2 列表組的樣式 154
8.2.3 列表組的嵌套使用 155
8.3 卡片 157
8.3.1 卡片的基本使用 157
8.3.2 卡片的樣式 158
8.3.3 卡片的排列 161
8.4 本章小結 163
上機指導 163
習題 165
第9章 設置Bootstrap中的公共樣式 166
9.1 邊框樣式 166
9.1.1 添加和清除邊框 166
9.1.2 設置圓角 169
9.2 設置浮動與清除浮動 170
9.2.1 如何設置浮動 170
9.2.2 設置響應式浮動 172
9.2.3 清除浮動 172
9.3 設置元素位置 173
9.3.1 設置元素的定位方式 174
9.3.2 固定元素的位置 177
9.4 display屬性 179
9.4.1 如何設置display屬性 179
9.4.2 設置元素的顯示與隱藏 180
9.5 本章小結 182
上機指導 182
習題 183
第 10章 Bootstrap的窗口和提示工具 184
10.1 警告框 184
10.1.1 添加警告框 184
10.1.2 為警告框添加關閉按鈕 186
10.1.3 警告框組件的方法與事件 188
10.2 模態框 190
10.2.1 模態框的調用 190
10.2.2 動態模態框 192
10.2.3 模態框組件的選項、方法與事件 198
10.3 提示工具的使用 202
10.3.1 toast組件 202
10.3.2 tooltip組件 205
10.3.3 popover組件 210
10.4 本章小結 216
上機指導 216
習題 217
第 11章 折疊面板與輪播組件 218
11.1 滾動監聽組件 218
11.1.1 滾動監聽組件的使用 218
11.1.2 在嵌套的導航中添加滾動監聽 221
11.1.3 在列表組中添加滾動監聽 222
11.1.4 滾動監聽組件的選項、方法和事件 223
11.2 折疊面板組件 225
11.2.1 折疊面板組件的使用 225
11.2.2 控制多個折疊面板 226
11.2.3 “手風琴”折疊面板 227
11.2.4 折疊面板組件的選項、方法和事件 228
11.3 輪播組件 230
11.3.1 輪播組件的使用 231
11.3.2 設置輪播組件的風格 234
11.3.3 輪播組件的選項、方法和事件 235
11.4 大塊屏組件 237
11.5 本章小結 238
上機指導 238
習題 239
第 12章 第三方插件的使用 240
12.1 日期選擇器 240
12.1.1 日期選擇器的初級應用 240
12.1.2 日期選擇器的高級應用 242
12.2 對話框插件 247
12.2.1 警告框 247
12.2.2 確認框 250
12.2.3 含表單控件的提示框 254
12.2.4 自定義對話框 257
12.3 顏色選擇器 260
12.3.1 顏色選擇器的初級應用 260
12.3.2 顏色選擇器的高級應用 263
12.4 本章小結 266
上機指導 266
習題 269
第 13章 綜合案例——抖音秀 270
13.1 項目概述 270
13.2 設計流程 270
13.3 系統預覽 271
13.4 開發工具準備 271
13.5 抖音秀的實現 271
13.5.1 頁頭頁尾區 271
13.5.2 視頻功能區 273
13.5.3 掛件功能區 274
13.6 本章小結 275
第 14章 課程設計——吃了麽外賣網 276
14.1 課程設計目的 276
14.2 系統設計 276
14.2.1 項目概述 276
14.2.2 系統功能結構 276
14.2.3 文件夾組織結構 277
14.2.4 系統預覽 277
14.3 首頁、登錄頁面以及註冊頁面的實現 278
14.3.1 首頁的實現 278
14.3.2 登錄頁面的實現 281
14.3.3 註冊頁面的實現 282
14.4 商家版功能實現 284
14.4.1 商家首頁 284
14.4.2 訂單管理頁面 285
14.4.3 菜品管理和菜品修改頁面 287
14.4.4 留言板管理頁面 289
14.5 買家版功能實現 290
14.5.1 買家首頁 290
14.5.2 商品選購頁面 291
14.5.3 商品支付頁面 296
14.5.4 支付方式選擇頁面 298
14.5.5 訂單追蹤頁面 299
14.5.6 買家評價頁面 300
14.6 本章小結 304