Bootstrap 入門經典 (Sams Teach Yourself Bootstrap in 24 Hours)

珍妮弗·凱瑞恩 (Jennifer Kyrnin)

買這商品的人也買了...

商品描述

<內容簡介>

Bootstrap是Twitter推出的開源的前端開發工具包,可以幫助用戶輕鬆創建響應式網站,目前在前端開發中具有廣泛的應用。
《Bootstrap入門經典》是Bootstrap的入門類圖書,主要分為4個部分。第1部分為Bootstrap的入門知識,講解了Bootstrap的安裝方法以及使用Bootstrap構建網站的方法;第2部分講解了使用Bootstrap CSS樣式和組件創建網站的方法;第3部分側重的是使用Bootstrap JavaScript插件為網站增加功能的方法;第4部分涵蓋了Bootstrap的自定義方法,介紹了Bootstrap Web開發的高級功能,以及如何創建不同於Bootstrap默認外觀的複雜設計。
《Bootstrap入門經典》內容系統,講解簡明實用,代碼示例利於理解,是前端開發人員入門Bootstrap的絕佳讀物,適合所有前端開發人員閱讀,有志於瞭解Bootstrap的讀者也可以從中獲益。

<章節目錄>

第1章什麼是Bootstrap,為什麼要使用它1
1.1什麼是Web框架1
1.1.1框架不僅是一個模板2
1.1.2框架的優缺點5
1.2什麼是Bootstrap 6
1.3 Bootstrap與其他框架有何
不同6
1.4為什麼應該使用Bootstrap 8
1.5小結8
1.6討論8
第2章下載安裝Bootstrap 11
2.1從哪裡得到Bootstrap 11
2.2獲取Bootstrap的其他
途徑13
2.2.1用Less編寫的源代碼13
2.2.2 Sass 15
2.2.3 Bootstrap CDN 16
2.3小結16
2.4討論16
第3章用基本模板構建第一個
BootStrap網站20
3.1最小的Bootstrap頁面20
3.2基本Bootstrap模板21
3.3更多Bootstrap模板示例25
3.3.1 Bootstrap Starter模板25
3.3.2 Bootstrap主題27
3.3.3 Bootstrap Jumbotron 27
3.4小結28
3.5討論28
第4章理解Normalize.CSS和
Bootstrap CSS基礎知識31
4.1什麼是Normalize.css 31
4.1.1什麼是CSS重置32
4.1.2 CSS重置的利弊32
4.1.3 Normalize.css不僅僅是CSS
重置32
4.2理解Bootstrap基礎結構34
4.2.1 Bootstrap使用HTML5 34
4.2.2移動優先34
4.2.3排版和基本鏈接樣式34
4.3小結37
4.4討論37
第5章網格及其用法40
5.1設計中的網格40
5.1.1為什麼在Web設計中使用
網格41
5.1.2三分法42
5.1.3黃金分割率44
5.2 Bootstrap網格系統45
5.3如何在Bootstrap中創建網格45
5.3.1創建基本網格45
5.3.2響應式列重置49
5.3.3列的偏移、排序和嵌套50
5.4 Bootstrap中的響應式Web
佈局51
5.5小結52
5.6討論53
第6章標籤、徽章、面板、Well和超大屏幕56
6.1標籤和徽章56
6.1.1標籤56
6.1.2徽章59
6.2 Well和麵板60
6.2.1 Well 60
6.2.2面板61
6.3超大屏幕63
6.4小結64
6.5討論65
第7章Bootstrap排版68
7.1 Bootstrap中的基本排版68
7.2標題70
7.2.1標題70
7.2.2頁眉74
7.3正文75
7.3.1內聯文本76
7.3.2元素對齊77
7.3 .3文本元素轉換78
7.4其他文本塊79
7.4.1代碼79
7.4.2引用語80
7.4.3列表80
7.4.4縮略語81
7.4.5地址81
7.5小結81
7.6討論83
第8章設置表格樣式86
8.1基本表格86
8.2 Bootstrap表格類88
8.3包含表格的面板91
8.4響應式表格93
8.5小結94
8.6討論94
第9章設置表單樣式97
9.1基本表單97
9.1.1水平表單100
9.1.2內聯表單101
9.2 Bootstrap支持的表單控件103
9.2.1基本輸入標記103
9.2.2複選框和單選按鈕104
9.2.3下拉菜單106
9.2.4設置表單控件的大小107
9.2.5幫助塊108
9.3輸入組108
9.3.1基本輸入組108
9.3.2設置輸入組的大小109
9.3.3奇妙的附加控件110
9.4 Bootstrap表單的交互性111
9.4.1焦點狀態111
9.4.2禁用和只讀狀態112
9.4.3驗證狀態112
9.5小結113
9.6討論114
第10章圖像、媒體對象和
Glyphicons 117
10.1圖像117
10.1.1響應式圖像118
10.1.2圖像形狀118
10.2媒體對象119
10.3縮略圖122
10.4 Glyphicon 124
10.5小結126
10.6討論129
第11章按鈕和按鈕組樣式設置及
使用132
11.1基本按鈕132
11.1.1按鈕標記133
11.1.2按鈕類和大小133
11.1.3按鈕狀態135
11.2按鈕組136
11.2.1水平按鈕組137
11.2 .2垂直按鈕組138
11.2.3按鈕工具欄138
11.3按鈕JavaScript 139
11.4小結139
11.5討論140
第12章用Bootstrap創建導航系統144
12.1標準導航元素144
12.2下拉菜單147
12.2.1拆分下拉菜單148
12.2 .2上拉式變種150
12.3導航欄151
12.3.1導航欄標題和品牌153
12.3.2切換導航開關153
12.3.3導航欄中的鏈接、文本、按鈕
和表單154
12.3.4改變導航欄的顏色和對齊
方式158
12.4麵包屑導航和分頁159
12.5列表組160
12.6小結163
12.7討論164
第13章Bootstrap實用工具168
13.1助手類168
13.1.1更改顏色169
13.1.2圖標170
13.1.3佈局類171
13.1 .4顯示和隱藏內容174
13.2響應式實用工具174
13.3打印類176
13.4響應式嵌入176
13.5 Bootstrap中的可訪問性177
13.6小結177
13.7討論179
第14章使用Bootstrap JavaScript
插件183
14.1如何使用Bootstrap JavaScript
插件183
14.2設置插件選項184
14.2.1參數形式的選項184
14.2.2數據屬性形式的選項185
14.3使用JavaScript API 186
14.3.1事件187
14.3.2無衝突187
14.3.3禁用JavaScript 187
14.4小結188
14.5討論188
第15章模態窗口191
15.1什麼是模態窗口191
15.2如何構建模態窗口192
15.2.1觸發模態窗口192
15.2.2模態窗口編碼194
15.3修改模態窗口197
15.3.1更改模態窗口的打開
方式197
15.3.2更改模態窗口的大小200
15.3.3更改佈局201
15.3.4動態更改模態內容203
15.4小結204
15.5討論206
第16章附加導航、選項卡和滾動
監聽209
16.1附加導航209
16.2選項卡212
16.3滾動監聽215
16.4結合使用這些插件216
16.5小結217
16.6討論219
第17章彈出框和工具提示222
17.1工具提示222
17.1.1工具提示選項228
17.1.2工具提示方法229
17.1 .3工具提示事件229
17.2彈出框229
17.2.1彈出框選項232
17.2.2彈出框方法233
17.2.3彈出框事件233
17.3小結233
17.4討論235
第18章過渡、按鈕、警告框和
進度條239
18.1過渡239
18.2按鈕240
18.2.1按鈕狀態240
18.2.2切換按鈕241
18.2.3複選框和單選按鈕241
18.2.4按鈕方法243
18.3警告框243
18.3.1警告框方法245
18.3.2警告框事件245
18.4進度條245
18.4.1創建進度條245
18.4.2設置進度條樣式246
18.5小結248
18.6討論249
第19章折疊插件和折疊面板254
19.1折疊插件254
19.1.1創建一個可折疊部分254
19.1.2水平折疊元素258
19.1.3折疊選項259
19.1.4折疊方法259
19.1.5折疊事件259
19.2折疊面板260
19.2.1創建折疊面板260
19.2.2使用折疊面板導航263
19.3小結265
19.4討論266
第20章輪播270
20.1創建輪播270
20.1.1基本輪播272
20.1.2更精緻的輪播274
20.2使用輪播插件276
20.2.1添加多個輪播277
20.2.2輪播選項278
20.2 .3輪播方法279
20.2.4輪播事件279
20.3 Web上的輪播279
20.3.1輪播最佳實踐279
20.3.2輪播的問題和解決方案280
20.4小結281
20.5討論282
第21章自定義Bootsrap和Bootstrap
網站286
21.1使用自己的CSS 286
21.2使用Bootstrap Customizer 290
21.2.1 Less文件和jQuery插件291
21.2.2 Less變量292
21.2.3下載和安裝自定義
Bootstrap 294
21.3使用第三方Bootstrap定製
工具295
21.4小結295
21.5討論295
第22章提高Bootstrap的可訪問性299
22.1什麼是可訪問性299
22.1.1可訪問性設計實踐300
22.1.2 WAI-ARIA和可訪問性301
22.2 Bootstrap中的可訪問設計301
22.2.1跳過導航302
22.2.2嵌套標題302
22.2.3顏色對比303
22.3 Bootstrap網站可訪問性
技巧303
22.4小結304
22.5討論304
第23章使用Less和Sass與Bootstrap
配合307
23.1什麼是CSS預處理器307
23.2使用Less 308
23.2.1 Less的功能308
23.2.2結合使用Less和
Bootstrap 310
23.3使用Sass 312
23.3.1 Sass的功能312
23.3.2結合使用Sass和
Bootstrap 314
23.4小結315
23.5討論315
第24章進一步應用Bootstrap 319
24.1 Bootstrap編輯器319
24.1.1 Web編輯器319
24.1.2主題構建和定製
工具321
24.2在WordPress中使用
Bootstrap 322
24.2.1使用WordPress插件322
24.2.2尋找用於WordPress的
Bootstrap主題323
24.2.3構建自己的WordPress
主題323
24.3用第三方附加程序擴展
Bootstrap 330
24.3.1 Bootstrap主題330
24.3.2 Bootstrap插件330
24.3.3 Bootstrap社區331
24.3.4漂亮的Bootstrap網站331
24.4小結333
24.5討論334