內容簡介
作者根據自己多年的網站開發及教學經驗,站在零基礎讀者的角度,詳細介紹了HTML和CSS的基礎知識,以及大量的前端開發技巧。
全書分為2大部分:第1部分是HTML基礎,主要介紹各種標籤的使用;第二部分是CSS基礎,主要介紹樣式布局操作。此外,作者還結合實際工作及前端面試,精心挑選了大量高質量的練習題放在每章最後,讀者可以邊學邊練,更好地掌握本書內容。
本書提供了所有案例的原始碼、配套視頻課程,以及各種工具手冊。另外,為方便老師教學,還提供了配套的PPT教學課件。
本書適合零基礎的初學者使用,可以作為前端開發人員的參考書,也可作為培訓學校、大中專院校相關專業的教學參考書。
圖書目錄
第 一部分 HTML 基礎
第 1 章 HTML 簡介 3
1.1 前端技術簡介 3
1.1.1 從“網頁製作”到“前端開發” 3
1.1.2 從“前端開發”到“後端開發” 4
1.1.3 學習路線 6
1.2 什麼是HTML ? 6
1.3 常見問題 7
第 2 章 開發工具 9
2.1 開發工具 9
2.2 使用HBuilder 10
第3 章 基本標籤 13
3.1 HTML 結構 13
3.2 head 標籤 15
3.2.1 title 標籤 15
3.2.2 meta 標籤 16
3.2.3 style 標籤 18
3.2.4 script 標籤 18
3.2.5 link 標籤 19
3.2.6 base 標籤 19
3.3 body 標籤 19
3.4 HTML 注釋 20
3.5 本章練習 21
第4 章 文本 22
4.1 文本簡介 22
4.1.1 頁面組成元素 22
4.1.2 HTML 文本 23
4.2 標題標籤 24
4.3 段落標籤 26
4.3.1 段落標籤
26
4.3.2 換行標籤
27
4.4 文本標籤 29
4.4.1 粗體標籤 29
4.4.2 斜體標籤 30
4.4.3 上標標籤 31
4.4.4 下標標籤 31
4.4.5 中劃線標籤 32
4.4.6 下劃線標籤 33
4.4.7 大字號標籤和小字號標籤 33
4.5 水平線標籤 34
4.6 div 標籤 35
4.7 自閉合標籤 37
4.8 塊元素和行內元素 38
4.8.1 塊元素 38
4.8.2 行內元素 40
4.9 特殊符號 40
4.9.1 網頁中的“空格” 40
4.9.2 網頁中的“特殊符號” 42
4.10 本章練習 44
第5 章 列表 45
5.1 列表簡介 45
5.2 有序列表 46
5.2.1 有序列表簡介 46
5.2.2 type 屬性 47
5.3 無序列表 48
5.3.1 無序列表簡介 48
5.3.2 type 屬性 49
5.3.3 深入無序列表 50
5.4 定義列表 53
5.5 HTML 語義化 54
5.6 本章練習 56
第6 章 表格 57
6.1 表格簡介 57
6.2 基本結構 57
6.3 完整結構 59
6.3.1 表格標題:caption 59
6.3.2 表頭單元格:th 60
6.4 語義化 62
6.5 合併行:rowspan 65
6.6 合併列:colspan 66
6.7 本章練習 67
第7 章 圖片 68
7.1 圖片標籤 68
7.1.1 src 屬性 68
7.1.2 alt 屬性和title 屬性 69
7.2 圖片路徑 71
7.2.1 page1.html 引用圖片 72
7.2.2 page2.html 引用圖片 73
7.3 圖片格式 75
7.3.1 點陣圖 75
7.3.2 矢量圖 76
7.4 本章練習 78
第8 章 超連結 80
8.1 超連結簡介 80
8.1.1 a 標籤 80
8.1.2 target 屬性 82
8.2 內部連結 83
8.3 錨點連結 84
8.4 本章練習 87
第9 章 表單 88
9.1 表單簡介 88
9.1.1 表單是什麼? 88
9.1.2 表單標籤 89
9.2 form 標籤 90
9.2.1 form 標籤簡介 90
9.2.2 form 標籤屬性 91
9.3 input 標籤 92
9.4 單行文本框 93
9.4.1 單行文本框簡介 93
9.4.2 單行文本框屬性 93
9.5 密碼文本框 95
9.5.1 密碼文本框簡介 95
9.5.2 密碼文本框屬性 97
9.6 單選框 98
9.6.1 單選框簡介 98
9.6.2 忽略點 99
9.7 複選框 102
9.8 按鈕 104
9.8.1 普通按鈕button 104
9.8.2 提交按鈕submit 105
9.8.3 重置按鈕reset 106
9.8.4 button 標籤 108
9.9 檔案上傳 108
9.10 多行文本框 109
9.11 下拉列表 110
9.11.1 下拉列表簡介 110
9.11.2 select 標籤屬性 111
9.11.3 option 標籤屬性 113
9.13 本章練習 115
第 10 章 框架 117
10.1 iframe 標籤 117
10.2 練習題 118
第二部分 CSS 基礎
第 11 章 CSS 簡介 121
11.1 CSS 簡介 121
11.1.1 CSS 是什麼 121
11.1.2 CSS 和CSS3 121
11.2 CSS 引入方式 122
11.3.1 外部樣式表 122
11.3.2 內部樣式表 123
11.3.3 行內樣式表 124
11.3 本章練習 125
第 12 章 CSS 選擇器 126
12.1 元素的id 和class 126
12.1.1 id 屬性 126
12.1.2 class 屬性 127
12.2 選擇器是什麼? 127
12.3 CSS 選擇器 129
12.3.1 元素選擇器 129
12.3.2 id 選擇器 130
12.3.3 class 選擇器 132
12.3.4 後代選擇器 134
12.3.5 群組選擇器 135
12.4 本章練習 138
第 13 章 字型樣式 139
13.1 字型樣式簡介 139
13.2 字型類型:font-family 140
13.3 字型大小:font-size 141
13.3.1 px 是什麼? 142
13.3.2 採用px 為單位 142
13.4 字型粗細:font-weight 143
13.5 字型風格:font-style 145
13.6 字型顏色:color 146
13.6.1 關鍵字 146
13.6.2 16 進制RGB 值 147
13.7 CSS 注釋 148
13.8 本章練習 150
第 14 章 文本樣式 152
14.1 文本樣式簡介 152
14.2 首行縮進:text-indent 152
14.3 水平對齊:text-align 154
14.4 文本修飾:text-decoration 155
14.4.1 text-decoration 屬性 155
14.4.2 3 種劃線的用途分析 157
14.5 大小寫:text-transform 157
14.6 行高:line-height 158
14.7 間距:letter-spacing、word-spacing 160
14.7.1 字間距 160
14.7.2 詞間距 161
14.8 本章練習 162
第 15 章 框線樣式 163
15.1 框線樣式簡介 163
15.2 整體樣式 164
15.2.1 框線的屬性 164
15.2.2 簡寫形式 166
15.3 局部樣式 167
15.4 本章練習 170
第 16 章 列表樣式 171
16.1 列表項符號:list-style-type 171
16.1.1 定義列表項符號 171
16.1.2 去除列表項符號 173
16.2 列表項圖片:list-style-image 174
16.3 本章練習 176
第 17 章 表格樣式 177
17.1 表格標題位置:caption-side 177
17.2 表格框線合併:border-collapse 179
17.3 表格框線間距:border-spacing 180
17.4 本章練習 182
第 18 章 圖片樣式 183
18.1 圖片大小 183
18.2 圖片框線 184
18.3 圖片對齊 185
18.3.1 水平對齊 185
18.3.2 垂直對齊 187
18.4 文字環繞:float 189
18.5 本章練習 191
第 19 章 背景樣式 192
19.1 背景樣式簡介 192
19.2 背景顏色:background-color 192
19.3 背景圖片樣式:background-image 194
19.4 背景圖片重複:background-repeat 196
19.5 背景圖片位置:background-position 198
19.5.1 像素值 198
19.5.2 關鍵字 199
19.6 背景圖片固定:background-attachment 201
19.7 本章練習 202
第 20 章 超連結樣式 203
20.1 超連結偽類 203
20.1.1 超連結偽類簡介 203
20.1.2 深入了解超連結偽類 205
20.2 深入了解:hover 206
20.3 滑鼠樣式 208
20.3.1 瀏覽器滑鼠樣式 208
20.3.2 自定義滑鼠樣式 209
20.4 本章練習 210
第 21 章 盒子模型 212
21.1 CSS 盒子模型 212
21.2 寬高:width、height 215
21.3 框線:border 218
21.4 內邊距:padding 219
21.4.1 padding 局部樣式 219
21.4.2 padding 簡寫形式 220
21.5 外邊距:margin 222
21.5.1 margin 局部樣式 222
21.5.2 margin 簡寫形式 226
21.5.3 瀏覽器審查元素 227
21.7 本章練習 228
第 22 章 浮動布局 230
22.1 文檔流簡介 230
22.1.1 正常文檔流 230
22.1.2 脫離文檔流 231
22.2 浮動 233
22.3 清除浮動 236
22.4 本章練習 238
第 23 章 定位布局 240
23.1 定位布局簡介 240
23.2 固定定位:fixed 240
23.3 相對定位:relative 243
23.4 絕對定位:absolute 245
23.5 靜態定位:static 247
23.6 本章練習 248
附錄A HTML 常用標籤 249
附錄B 常用表單標籤 251
附錄C CSS 常用屬性 252
附錄D W3C 十六色 254