目錄
第1章 Web前端技術簡介 1
1.1 Web前端概述 1
1.1.1 初識Web前端 1
1.1.2 Web前端開發的三大
核心技術 2
1.2 Web前端開發工具 4
1.2.1 瀏覽器 4
1.2.2 網頁編輯器 6
1.2.3 切圖軟件 10
1.3 HTML入門 10
1.3.1 什麼是HTML 10
1.3.2 HTML基本結構 11
1.3.3 運行第一個HTML程序 13
1.3.4 HTML注釋 14
1.3.5 HTML屬性 15
1.4 本章小結 15
1.5 習題 16
第2章 HTML詳解 17
2.1 HTML曆史 17
2.1.1 HTML曆史版本 17
2.1.2 HTML與XHTML關係 18
2.2 什麼是HTML語義化 18
2.3 HTML常用標簽 19
2.3.1 標題標簽 19
2.3.2 段落標簽 21
2.3.3 文本格式化標簽 22
2.3.4 引用標簽 25
2.3.5 水平綫標簽 28
2.3.6 特殊符號 29
2.3.7 圖像標簽 31
2.3.8 鏈接標簽 36
2.3.9 列錶標簽 40
2.3.10 <div>與<span> 46
2.4 本章小結 49
2.5 習題 49
第3章 HTML錶格與錶單 50
3.1 HTML錶格 50
3.1.1 錶格基本結構 51
3.1.2 錶頭與標題 53
3.1.3 錶格語義化 55
3.1.4 閤並行與列 57
3.1.5 單元格邊距與間距 59
3.1.6 錶格其他屬性 60
3.2 HTML錶單 64
3.2.1 <form>標簽 65
3.2.2 <input>標簽 68
3.2.3 <textarea>標簽 77
3.2.4 <select>標簽 78
3.2.5 <label>標簽 82
3.3 本章小結 83
3.4 習題 83
第4章 CSS入門 85
4.1 CSS簡介 85
4.1.1 CSS的曆史版本 85
4.1.2 CSS的基本結構 86
4.2 背景樣式 90
4.3 邊框樣式 97
4.4 文字樣式 99
4.5 段落樣式 106
4.6 復閤樣式 115
4.6.1 復閤寫法特點 115
4.6.2 復閤寫法注意事項 118
4.7 本章小結 119
4.8 習題 119
第5章 CSS基礎 121
5.1 CSS引入方式 121
5.1.1 內部引入方式 121
5.1.2 外部引入方式 125
5.1.3 三種方式的對比 129
5.2 選擇符詳解 129
5.2.1 id選擇符 130
5.2.2 class選擇符 130
5.2.3 tag選擇符 131
5.2.4 通配選擇符 133
5.2.5 組選擇符 133
5.2.6 包含選擇符 134
5.2.7 僞類選擇符 135
5.3 樣式的繼承 139
5.4 樣式的優先級 141
5.5 本章小結 149
5.6 習題 149
第6章 CSS進階 151
6.1 CSS盒子模型 151
6.1.1 初識盒子模型 151
6.1.2 content內容 152
6.1.3 padding內邊距 153
6.1.4 border邊框 154
6.1.5 margin外邊距 156
6.1.6 margin疊加和傳遞 158
6.2 塊與內聯 165
6.2.1 塊特點 165
6.2.2 內聯特點 168
6.2.3 塊標簽與內聯標簽的比較 172
6.3 默認樣式 172
6.3.1 瀏覽器調試工具 172
6.3.2 標簽默認值 173
6.3.3 CSS reset 175
6.4 其他常用樣式 179
6.4.1 顯示框類型 180
6.4.2 溢齣隱藏 184
6.4.3 透明度 189
6.5 本章小結 191
6.6 習題 191
第7章 CSS浮動與定位 193
7.1 浮動原理 193
7.1.1 脫離文檔流 193
7.1.2 float屬性 194
7.1.3 float的注意點 199
7.1.4 clear屬性 204
7.1.5 清除嵌套中浮動 207
7.2 CSS定位 212
7.2.1 定位屬性 212
7.2.2 相對定位 213
7.2.3 絕對定位 215
7.2.4 固定定位 217
7.2.5 定位的層級 219
7.3 本章小結 221
7.4 習題 221
第8章 HTML&CSS擴展 223
8.1 標簽規範 223
8.1.1 嵌套問題 223
8.1.2 格式問題 226
8.2 HTML擴展 227
8.2.1 <link>標簽 227
8.2.2 <meta>標簽 228
8.2.3 <area>標簽 229
8.2.4 <pre>標簽 231
8.2.5 <iframe>標簽 232
8.2.6 <embed>標簽 233
8.3 CSS擴展 234
8.3.1 CSS雪碧 234
8.3.2 最大、最小寬高 237
8.3.3 添加省略號 240
8.3.4 CSS錶格 241
8.4 本章小結 242
8.5 習題 242
第9章 HTML&CSS實戰 243
9.1 元素屏幕居中 243
9.1.1 問題 243
9.1.2 解決方案 243
9.2 分頁展示 245
9.2.1 問題 245
9.2.2 解決方案 246
9.3 三角形圖標 248
9.3.1 問題 248
9.3.2 解決方案 248
9.4 漂亮的上傳按鈕 250
9.4.1 問題 250
9.4.2 解決方案 251
9.5 標簽切換頁 252
9.5.1 布局製作 252
9.5.2 JavaScript動態切換 255
9.6 Photoshop切圖 256
9.6.1 菜單項 256
9.6.2 工具欄 261
9.6.3 輔助信息 263
9.7 Photoshop切圖流程 265
9.7.1 圖片格式切圖 265
9.7.2 PSD格式切圖 268
9.8 Photoshop切圖實例 269
9.8.1 “韆鋒動態”效果圖製作 269
9.8.2 “全國開班”效果圖製作 277
9.9 本章小結 282
9.10 習題 283
第10章 布局方案與整頁製作 284
10.1 CSS布局 284
10.1.1 固定布局 284
10.1.2 自適應布局 287
10.1.3 混閤布局 291
10.2 整頁製作 295
10.2.1 結構劃分與公共樣式 296
10.2.2 網頁模塊命名規範 296
10.2.3 頭部製作 297
10.2.4 導航製作 298
10.2.5 廣告製作 300
10.2.6 列錶製作 301
10.2.7 信息製作 303
10.2.8 尾部製作 305
10.3 瀏覽器兼容性 307
10.3.1 CSS Hack 307
10.3.2 IE條件注釋語句 311
10.3.3 常見IE6瀏覽器的兼容性問題 312
10.4 本章小結 319
10.5 習題 319
第11章 HTML5標簽與屬性 321
11.1 HTML5簡介 321
11.1.1 HTML5曆史 321
11.1.2 新增語法 321
11.2 HTML5新增標簽 323
11.2.1 結構標簽 323
11.2.2 媒體標簽 330
11.2.3 錶單控件標簽 332
11.2.4 其他標簽 341
11.3 HTML5新增屬性 347
11.3.1 data-*屬性 347
11.3.2 hidden屬性 347
11.3.3 spellcheck屬性 347
11.3.4 contenteditable屬性 348
11.4 HTML5其他功能 349
11.4.1 拖放文件 349
11.4.2 本地存儲 352
11.4.3 地理信息 354
11.4.4 雙工通信 356
11.5 本章小結 358
11.6 習題 358
第12章 CSS3基礎樣式 360
12.1 瀏覽器前綴 360
12.2 CSS3選擇器 361
12.2.1 屬性選擇器 361
12.2.2 結構僞類選擇器 364
12.2.3 狀態僞類選擇器 366
12.2.4 其他選擇器 368
12.3 CSS3文本屬性 369
12.3.1 text-shadow屬性 369
12.3.2 text-stroke屬性 370
12.3.3 direction屬性 371
12.3.4 @font-face屬性 372
12.4 CSS3背景屬性 373
12.4.1 background-size屬性 374
12.4.2 background-origin屬性 375
12.4.3 background-clip屬性 377
12.5 CSS3顔色屬性 378
12.5.1 linear-gradient屬性 378
12.5.2 radial-gradient屬性 380
12.6 CSS3邊框屬性 381
12.6.1 border-radius屬性 381
12.6.2 border-image屬性 383
12.6.3 box-shadow屬性 386
12.7 本章小結 388
12.8 習題 388
第13章 CSS3動畫與3D 390
13.1 CSS3過渡 390
13.1.1 transition屬性 390
13.1.2 cubic-bezier值 395
13.2 CSS3變形 396
13.2.1 transform屬性 396
13.2.2 transform-origin屬性 403
13.3 CSS3動畫 404
13.3.1 animation屬性 404
13.3.2 animation-fill-mode屬性 408
13.3.3 animation-direction屬性 408
13.3.4 animation-play-state屬性 410
13.4 CSS3之3D 411
13.4.1 transform3D屬性 411
13.4.2 perspective 416
13.4.3 transform-style屬性 419
13.4.4 perspective-origin屬性 420
13.4.5 backface-visibility屬性 421
13.5 本章小結 423
13.6 習題 423
第14章 移動端布局與響應式開發 425
14.1 移動端布局 425
14.1.1 移動端模擬器 425
14.1.2 手機的基本概念 426
14.1.3 viewport 427
14.1.4 移動端布局方案 430
14.2 彈性盒模型 437
14.2.1 flex方式 438
14.2.2 排列與對齊 438
14.2.3 換行與對齊 444
14.2.4 子元素屬性 447
14.3 響應式開發 453
14.3.1 媒體查詢 453
14.3.2 查詢順序 455
14.3.3 修改樣式 456
14.4 本章小結 461
14.5 習題 461
· · · · · · (收起)