本書緊密圍繞網(wǎng)頁(yè)設(shè)計(jì)師在制作網(wǎng)頁(yè)過(guò)程中的實(shí)際需要和應(yīng)該掌握的技術(shù)，全面介紹了如何使用HTML、CSS、JavaScrip 以及前端框架進(jìn)行網(wǎng)站建設(shè)和網(wǎng)頁(yè)設(shè)計(jì)。
從內(nèi)功到招式，全書貫穿了不同行業(yè)的多種實(shí)例，各實(shí)例均經(jīng)過(guò)精心設(shè)計(jì)，操作步驟清晰簡(jiǎn)明，技術(shù)分析深入淺出，能夠幫助讀者沉浸在真實(shí)的開(kāi)發(fā)狀態(tài)中。這樣，無(wú)論以后是面對(duì)公司的面試，還是真實(shí)的工作需求，讀者都能夠跨過(guò)所學(xué)與所用之間的鴻溝。
此外，本書還精心配備了PPT 電子課件，便于老師課堂教學(xué)和學(xué)生把握知識(shí)要點(diǎn)。
初學(xué)優(yōu)選 入門經(jīng)典
針對(duì)前端新手全新打造，一本書搞定 HTML、CSS、JavaScript
· 精品呈現(xiàn) 通俗易懂
語(yǔ)言輕松幽默，講解一針見(jiàn)血，從全新角度講透前端開(kāi)發(fā)核心技術(shù)
· 五位一體 全面服務(wù)
在線教程 在線問(wèn)答 面試練習(xí) 源碼素材 課件 PPT
（獲取方式請(qǐng)加本書封底QQ群）
莫振杰，綠葉學(xué)習(xí)網(wǎng)（http://www.lvyestudy.com）站長(zhǎng)，利用該網(wǎng)站用于分享自己在前后端開(kāi)發(fā)中的一些經(jīng)驗(yàn)，并且制作相關(guān)前后端開(kāi)發(fā)的在線教程。這些在線教程在互聯(lián)網(wǎng)引起廣泛關(guān)注，極大受到網(wǎng)友推崇。本人編寫過(guò)大量原創(chuàng)在線教程和《Web前端開(kāi)發(fā)精品課》系列圖書，廣受網(wǎng)友稱贊與推崇。
《Web前端開(kāi)發(fā)精品課HTML與CSS基礎(chǔ)教程》
《Web前端開(kāi)發(fā)精品課HTML與CSS進(jìn)階教程》
《Web前端開(kāi)發(fā)精品課JavaScript基礎(chǔ)教程》
《Web前端開(kāi)發(fā)精品課HTML5 Canvas開(kāi)發(fā)詳解》
目錄
第一部分 HTML基礎(chǔ)
第01章 HTML簡(jiǎn)介
1.1 前端技術(shù)簡(jiǎn)介 2
1.1.1 從網(wǎng)頁(yè)制作到前端開(kāi)發(fā) 2
1.1.2 從前端開(kāi)發(fā)到后端開(kāi)發(fā) 3
1.1.3 學(xué)習(xí)路線 5
1.2 什么是HTML 5
1.3 教程介紹 6
1.3.1 教程簡(jiǎn)介 6
1.3.2 初學(xué)者比較關(guān)心的問(wèn)題7
第02章 開(kāi)發(fā)工具
2.1 開(kāi)發(fā)工具 8
2.2 使用Hbuilder 9
第03章 基本標(biāo)簽
3.1 HTML結(jié)構(gòu) 11
3.2 head標(biāo)簽 12
3.2.1 title標(biāo)簽 13
3.2.2 meta標(biāo)簽 13
3.2.3 style標(biāo)簽 15
3.2.4 script標(biāo)簽 15
3.2.5 link標(biāo)簽 16
3.2.6 base標(biāo)簽 16
3.3 body標(biāo)簽 16
3.4 HTML注釋 17
3.5 練習(xí)題 18
第04章 文本
4.1 文本簡(jiǎn)介 19
4.1.1 頁(yè)面組成元素 19
4.1.2 HTML文本 20
4.2 標(biāo)題標(biāo)簽 21
4.3 段落標(biāo)簽 22
4.3.1 段落標(biāo)簽：
22
4.3.2 換行標(biāo)簽：
23
4.4 文本標(biāo)簽 25
4.4.1 粗體標(biāo)簽 25
4.4.2 斜體標(biāo)簽 26
4.4.3 上標(biāo)標(biāo)簽 26
4.4.4 下標(biāo)標(biāo)簽 27
4.4.5 中劃線標(biāo)簽 27
4.4.6 下劃線標(biāo)簽 28
4.4.7 大字號(hào)標(biāo)簽和小字號(hào)標(biāo)簽 28
4.5 水平線標(biāo)簽 29
4.6 div標(biāo)簽 30
4.7 自閉合標(biāo)簽 31
4.8 塊元素和行內(nèi)元素 32
4.8.1 塊元素 33
4.8.2 行內(nèi)元素 34
4.9 特殊符號(hào) 35
4.9.1 網(wǎng)頁(yè)中的空格 35
4.9.2 網(wǎng)頁(yè)中的特殊符號(hào) 36
4.10 練習(xí)題 38
第05章 列表
5.1 列表簡(jiǎn)介 39
5.2 有序列表 40
5.2.1 有序列表簡(jiǎn)介 40
5.2.2 type屬性 41
5.3 無(wú)序列表 42
5.3.1 無(wú)序列表簡(jiǎn)介 42
5.3.2 type屬性 43
5.3.3 深入無(wú)序列表 44
5.4 定義列表 46
5.5 HTML語(yǔ)義化 47
5.6 練習(xí)題 48
第06章 表格
6.1 表格簡(jiǎn)介 49
6.2 基本結(jié)構(gòu) 49
6.3 完整結(jié)構(gòu) 51
6.3.1 表格標(biāo)題：caption 51
6.3.2 表頭單元格：th 52
6.4 語(yǔ)義化 54
6.5 合并行：rowspan 56
6.6 合并列：colspan 57
6.7 練習(xí)題 58
第07章 圖片
7.1 圖片標(biāo)簽 59
7.1.1 src屬性 59
7.1.2 alt屬性和title屬性 60
7.2 圖片路徑 62
7.2.1 page1.html引用圖片 62
7.2.2 page2.html引用圖片 63
7.3 圖片格式 64
7.3.1 位圖 64
7.3.2 矢量圖 66
7.4 練習(xí)題 67
第08章 超鏈接
8.1 超鏈接簡(jiǎn)介 68
8.1.1 a標(biāo)簽 69
8.1.2 target屬性 70
8.2 內(nèi)部鏈接 70
8.3 錨點(diǎn)鏈接 72
8.4 練習(xí)題 74
第09章 表單
9.1 表單簡(jiǎn)介 75
9.1.1 表單是什么75
9.1.2 表單標(biāo)簽 76
9.2 form標(biāo)簽 76
9.2.1 form標(biāo)簽簡(jiǎn)介 76
9.2.2 form標(biāo)簽屬性 77
9.3 input標(biāo)簽 78
9.4 單行文本框 79
9.4.1 單行文本框簡(jiǎn)介 79
9.4.2 單行文本框?qū)傩?79
9.5 密碼文本框 81
9.5.1 密碼文本框簡(jiǎn)介 81
9.5.2 密碼文本框?qū)傩?82
9.6 單選框 83
9.6.1 單選框簡(jiǎn)介 83
9.6.2 忽略點(diǎn) 84
9.7 復(fù)選框 86
9.8 按鈕 87
9.8.1 普通按鈕button 88
9.8.2 提交按鈕submit 89
9.8.3 重置按鈕reset 89
9.8.4 button標(biāo)簽 91
9.9 文件上傳 91
9.10 多行文本框 92
9.11 下拉列表 93
9.11.1 下拉列表簡(jiǎn)介 93
9.11.2 select標(biāo)簽屬性 94
9.11.3 option標(biāo)簽屬性 95
9.12 練習(xí)題 97
第10章 框架
10.1 iframe標(biāo)簽 99
10.2 練習(xí)題 100
第二部分 CSS基礎(chǔ)
第11章 CSS簡(jiǎn)介
11.1 CSS簡(jiǎn)介 102
11.1.1 CSS是什么 102
11.1.2 CSS和CSS3 102
11.2 教程簡(jiǎn)介 103
11.3 CSS引入方式 103
11.3.1 外部樣式表 103
11.3.2 內(nèi)部樣式表 104
11.3.3 行內(nèi)樣式表 105
11.4 練習(xí)題 106
第12章 CSS選擇器
12.1 元素的id和class 107
12.1.1 id屬性 107
12.1.2 class屬性 108
12.2 選擇器是什么 108
12.3 CSS選擇器 109
12.3.1 元素選擇器 110
12.3.2 id選擇器 110
12.3.3 class選擇器 111
12.3.4 后代選擇器 113
12.3.5 群組選擇器 114
12.4 練習(xí)題 116
第13章 字體樣式
13.1 字體樣式簡(jiǎn)介 118
13.2 字體類型（font-family）119
13.3 字體大小（font-size）120
13.3.1 px是什么 120
13.3.2 采用px為單位 121
13.4 字體粗細(xì)（font-weight）122
13.5 字體風(fēng)格（font-style）123
13.6 字體顏色（color）125
13.6.1 關(guān)鍵字 125
13.6.2 16進(jìn)制RGB值 125
13.7 CSS注釋 126
13.8 練習(xí)題 128
第14章 文本樣式
14.1 文本樣式簡(jiǎn)介 129
14.2 首行縮進(jìn)（text-indent）129
14.3 水平對(duì)齊（text-align）130
14.4 文本修飾（text-decoration）131
14.4.1 text-decoration屬性 131
14.4.2 三種劃線的用途分析 133
14.5 大小寫（text-transform）134
14.6 行高（line-height）135
14.7 間距（letter-spacing和word-spacing）136
14.7.1 字間距 136
14.7.2 詞間距 136
14.8 練習(xí)題 137
第15章 邊框樣式
15.1 邊框樣式簡(jiǎn)介 139
15.2 整體樣式 140
15.2.1 邊框?qū)傩?140
15.2.2 簡(jiǎn)寫形式 142
15.3 局部樣式 142
15.4 練習(xí)題 145
第16章 列表樣式
16.1 列表項(xiàng)符號(hào)（list-style-type）146
16.1.1 定義列表項(xiàng)符號(hào) 146
16.1.2 去除列表項(xiàng)符號(hào) 148
16.2 列表項(xiàng)圖片（list-style-image）149
16.3 練習(xí)題 150
第17章 表格樣式
17.1 表格標(biāo)題位置（caption-side）151
17.2 表格邊框合并（border-collapse）152
17.3 表格邊框間距（border-spacing）154
17.4 練習(xí)題 155
第18章 圖片樣式
18.1 圖片大小 156
18.2 圖片邊框 157
18.3 圖片對(duì)齊 158
18.3.1 水平對(duì)齊 158
18.3.2 垂直對(duì)齊 159
18.4 文字環(huán)繞初識(shí)float 162
18.5 練習(xí)題 163
第19章 背景樣式
19.1 背景樣式簡(jiǎn)介 164
19.2 背景顏色（background-color）164
19.3 背景圖片樣式（background-image）166
19.4 背景圖片重復(fù)（background-repeat）167
19.5 背景圖片位置（background-position）169
19.5.1 像素值 169
19.5.2 關(guān)鍵字 170
19.6 背景圖片固定（background-attachment）172
19.7 練習(xí)題 173
第20章 超鏈接樣式
20.1 超鏈接偽類 174
20.1.1 超鏈接偽類簡(jiǎn)介 174
20.1.2 深入了解超鏈接偽類 175
20.2 深入了解:hover 177
20.3 鼠標(biāo)樣式 178
20.3.1 瀏覽器鼠標(biāo)樣式 178
20.3.2 自定義鼠標(biāo)樣式 180
20.4 練習(xí)題 181
第21章 盒子模型
21.1 CSS盒子模型 182
21.2 寬和高（width和height）184
21.3 邊框（border）187
21.4 內(nèi)邊距（padding）188
21.4.1 padding局部樣式 188
21.4.2 padding簡(jiǎn)寫形式 189
21.5 外邊距（margin）191
21.5.1 margin局部樣式191
21.5.2 margin簡(jiǎn)寫形式 194
21.5.3 瀏覽器審查元素 195
21.6 練習(xí)題 196
第22章 浮動(dòng)布局
22.1 文檔流簡(jiǎn)介 197
22.1.1 正常文檔流 197
22.1.2 脫離文檔流 198
22.2 浮動(dòng) 200
22.3 清除浮動(dòng) 202
22.4 練習(xí)題 204
第23章 定位布局
23.1 定位布局簡(jiǎn)介 205
23.2 固定定位：fixed 206
23.3 相對(duì)定位：relative 207
23.4 絕對(duì)定位：absolute 209
23.5 靜態(tài)定位：static 211
23.6 練習(xí)題 211
第三部分 JavaScript基礎(chǔ)
第24章 JavaScript簡(jiǎn)介
24.1 JavaScript是什么214
24.1.1 JavaScript簡(jiǎn)介 214
24.1.2 教程介紹 215
24.2 JavaScript開(kāi)發(fā)工具 216
24.3 JavaScript引入方式 217
24.3.1 外部JavaScript 218
24.3.2 內(nèi)部JavaScript 219
24.3.3 元素屬性JavaScript 220
24.4 一個(gè)簡(jiǎn)單的JavaScript程序 221
24.5 練習(xí)題 222
第25章 語(yǔ)法基礎(chǔ)
25.1 語(yǔ)法簡(jiǎn)介 223
25.2 變量與常量 224
25.2.1 變量 225
25.2.2 常量 229
25.3 數(shù)據(jù)類型 229
25.3.1 數(shù)字 229
25.3.2 字符串 230
25.3.3 布爾值 232
25.3.4 未定義值 233
25.3.5 空值 234
25.4 運(yùn)算符 234
25.4.1 算術(shù)運(yùn)算符 235
25.4.2 賦值運(yùn)算符 239
25.4.3 比較運(yùn)算符 240
25.4.4 邏輯運(yùn)算符 241
25.4.5 條件運(yùn)算符 244
25.5 表達(dá)式與語(yǔ)句 245
25.6 類型轉(zhuǎn)換 245
25.6.1 字符串轉(zhuǎn)換為數(shù)字 245
25.6.2 數(shù)字轉(zhuǎn)換為字符串 248
25.7 轉(zhuǎn)義字符 249
25.8 注釋 251
25.8.1 單行注釋 251
25.8.2 多行注釋 252
25.9 練習(xí)題 253
第26章 流程控制
26.1 流程控制簡(jiǎn)介 255
26.1.1 順序結(jié)構(gòu) 255
26.1.2 選擇結(jié)構(gòu) 256
26.1.3 循環(huán)結(jié)構(gòu) 257
26.2 選擇結(jié)構(gòu)：if 257
26.2.1 單向選擇：if… 257
26.2.2 雙向選擇：if…else… 259
26.2.3 多向選擇：if…else if…else… 260
26.2.4 if語(yǔ)句的嵌套 262
26.3 選擇結(jié)構(gòu)：switch 264
26.4 循環(huán)結(jié)構(gòu)：while 267
26.5 循環(huán)結(jié)構(gòu)：do…while 270
26.6 循環(huán)結(jié)構(gòu)：for 271
26.7 判斷整數(shù)或小數(shù) 274
26.8 找出水仙花數(shù) 275
26.9 練習(xí)題 276
第27章 初識(shí)函數(shù)
27.1 函數(shù)是什么？ 278
27.2 函數(shù)的定義 280
27.2.1 沒(méi)有返回值的函數(shù) 280
27.2.2 有返回值的函數(shù) 282
27.2.3 全局變量與局部變量 283
27.3 函數(shù)的調(diào)用 285
27.3.1 直接調(diào)用 286
27.3.2 在表達(dá)式中調(diào)用 286
27.3.3 在超鏈接中調(diào)用 287
27.3.4 在事件中調(diào)用 288
27.4 嵌套函數(shù) 289
27.5 內(nèi)置函數(shù) 290
27.6 判斷某一年是否閏年 291
27.7 求出任意五個(gè)數(shù)最大值 292
27.8 練習(xí)題 292
第28章 字符串對(duì)象
28.1 內(nèi)置對(duì)象簡(jiǎn)介 294
28.2 獲取字符串長(zhǎng)度 295
28.3 大小寫轉(zhuǎn)換 296
28.4 獲取某一個(gè)字符 297
28.5 截取字符串 298
28.6 替換字符串 300
28.7 分割字符串 302
28.8 檢索字符串的位置 304
28.9 統(tǒng)計(jì)某一個(gè)字符的個(gè)數(shù) 306
28.10 統(tǒng)計(jì)字符串中有多少個(gè)數(shù)字307
28.11 練習(xí)題 308
第29章 數(shù)組對(duì)象
29.1 數(shù)組是什么 309
29.2 數(shù)組的創(chuàng)建 310
29.3 數(shù)組的獲取 310
29.4 數(shù)組的賦值 311
29.5 獲取數(shù)組長(zhǎng)度 312
29.6 截取數(shù)組某部分 315
29.7 為數(shù)組添加元素 316
29.7.1 在數(shù)組開(kāi)頭添加元素：unshift() 316
29.7.2 在數(shù)組結(jié)尾添加元素：push() 318
29.8 刪除數(shù)組元素 319
29.8.1 刪除數(shù)組中第一個(gè)元素：shift() 319
29.8.2 刪除數(shù)組最后一個(gè)元素：pop() 320
29.9 數(shù)組大小比較 ：sort()322
29.10 數(shù)組顛倒順序：reverse()323
29.11 將數(shù)組元素連接成字符串：join()323
29.12 數(shù)組與字符串的轉(zhuǎn)換操作 326
29.13 計(jì)算面積與體積，返回一個(gè)數(shù)組 326
29.14 練習(xí)題 327
第30章 時(shí)間對(duì)象
30.1 日期對(duì)象簡(jiǎn)介 329
30.2 操作年、月、日 331
30.2.1 獲取年、月、日 331
30.2.2 設(shè)置年、月、日 333
30.3 操作時(shí)、分、秒 334
30.3.1 獲取時(shí)、分、秒 334
30.3.2 設(shè)置時(shí)、分、秒 335
30.4 獲取星期幾 336
30.5 練習(xí)題 338
第31章 數(shù)學(xué)對(duì)象
31.1 數(shù)學(xué)對(duì)象簡(jiǎn)介 339
31.2 Math對(duì)象的屬性 339
31.3 Math對(duì)象的方法 341
31.4 最大值與最小值 341
31.5 取整運(yùn)算 342
31.5.1 向下取整：floor() 342
31.5.2 向上取整：ceil() 343
31.6 三角函數(shù) 344
31.7 生成隨機(jī)數(shù) 346
31.7.1 隨機(jī)生成某個(gè)范圍內(nèi)的任意數(shù) 346
31.7.2 隨機(jī)數(shù)生成某個(gè)范圍內(nèi)的整數(shù) 347
31.8 生成隨機(jī)驗(yàn)證碼 347
31.9 生成隨機(jī)顏色值 348
31.10 練習(xí)題 349
第32章 DOM基礎(chǔ)
32.1 核心技術(shù)簡(jiǎn)介 350
32.2 DOM是什么 351
32.2.1 DOM對(duì)象 351
32.2.2 DOM結(jié)構(gòu) 351
32.3 節(jié)點(diǎn)類型 352
32.4 獲取元素 353
32.4.1 getElementById() 353
32.4.2 getElementsByTagName 355
32.4.3 getElementsByClassName() 359
32.4.4 querySelector()和querySelectorAll() 360
32.4.5 getElementsByName() 363
32.4.6 document.title和document.body 364
32.5 創(chuàng)建元素 365
32.6 插入元素 370
32.6.1 appendChild() 370
32.6.2 insertBefore() 372
32.7 刪除元素 373
32.8 復(fù)制元素 376
32.9 替換元素 377
32.10 練習(xí)題 378
第33章 DOM進(jìn)階
33.1 HTML屬性操作（對(duì)象屬性） 380
33.1.1 獲取HTML屬性值 380
33.1.2 設(shè)置HTML屬性值 386
33.2 HTML屬性操作（對(duì)象方法） 388
33.2.1 getAttribute() 388
33.2.2 setAttribute() 390
33.2.3 removeAttribute() 391
33.2.4 hasAttribute() 393
33.3 CSS屬性操作 394
33.3.1 獲取CSS屬性值 394
33.3.2 設(shè)置CSS屬性值 396
33.3.3 最后一個(gè)問(wèn)題 401
33.4 DOM遍歷 404
33.4.1 查找父元素 404
33.4.2 查找子元素 406
33.4.3 查找兄弟元素 410
33.5 innerHTML和innerText 411
33.6 練習(xí)題 414
第34章 事件基礎(chǔ)
34.1 事件是什么 415
34.2 事件調(diào)用方式 416
34.2.1 在script標(biāo)簽中調(diào)用 416
34.2.2 在元素中調(diào)用事件 417
34.3 鼠標(biāo)事件 418
34.3.1 鼠標(biāo)單擊 419
34.3.2 鼠標(biāo)移入和鼠標(biāo)移出 421
34.3.3 鼠標(biāo)按下和鼠標(biāo)松開(kāi) 422
34.4 鍵盤事件 423
34.5 表單事件 425
34.5.1 onfocus和onblur 425
34.5.2 onselect 427
34.5.3 onchange 429
34.6 編輯事件 432
34.6.1 oncopy 432
34.6.2 onselectstart 433
34.6.3 oncontextmenu 434
34.7 頁(yè)面事件 435
34.7.1 onload 435
34.7.2 onbeforeunload 437
34.8 練習(xí)題 438
第35章 事件進(jìn)階
35.1 事件監(jiān)聽(tīng)器 439
35.1.1 事件處理器 439
35.1.2 事件監(jiān)聽(tīng)器 440
35.2 event對(duì)象 447
35.2.1 type 448
35.2.2 keyCode 448
35.3 this 451
35.4 練習(xí)題 454
第36章 window對(duì)象
36.1 window對(duì)象簡(jiǎn)介 455
36.2 窗口操作 457
36.2.1 打開(kāi)窗口 457
36.2.2 關(guān)閉窗口 462
36.3 對(duì)話框 464
36.3.1 alert() 464
36.3.2 confirm() 465
36.3.3 prompt() 466
36.4 定時(shí)器 467
36.4.1 setTimeout()和clearTimeout() 468
36.4.2 setInterval()和clearInterval() 472
36.5 location對(duì)象 476
36.5.1 window.location.href 476
36.5.2 window.location.search 477
13.5.3 window.location.hash 478
36.6 navigator對(duì)象 479
36.7 練習(xí)題 481
第37章 document對(duì)象
37.1 document對(duì)象簡(jiǎn)介 482
37.2 document對(duì)象屬性 482
37.2.1 document.URL 483
37.2.2 document.referrer 484
37.3 document對(duì)象方法 484
37.3.1 document.write() 485
37.3.2 document.writeln() 485
37.4 練習(xí)題 487
后記
新書資訊