《Web前端開發精品課：HTML與CSS進階教程》是2020年1月人民郵電出版社出版的圖書，作者是莫振傑。
基本介紹
- 書名：Web前端開發精品課：HTML與CSS進階教程
- 作者：莫振傑
- ISBN：9787115432957
- 頁數：230頁
- 定價：39元
- 出版社：人民郵電出版社
- 出版時間：2020年1月
- 裝幀：平裝
- 開本：小16開
內容簡介,圖書目錄,
內容簡介
本書內容結合筆者在前後端大量開發中的實戰經驗，系統化知識，濃縮精華，用通俗易懂的語言直擊學習者的痛點。通過本書，能讓你從“野生網頁設計師”水平提升達到糊迎臘“真正前端工程師”水只承疊試平。
全書分為兩大部分：首部分是HTML進階內容，主要介紹HTML**技巧和HTML語義化；第 二部分是CSS進階內容，主要介紹CSS開發技巧、代碼規範、性能最佳化、屬性本質、重要概念（如包含塊、BFC和IFC等）。
除了知識講解，教程還融入了大量的開發案例，更加注重編程思維的培養，並且提供學習者一個流暢的學習思路。
圖書目錄
第 一部分 HTML進階
第01章 HTML基礎知識
1.1 HTML和CSS進階簡介 2
1.1.1 你真的精通HTML和CSS嗎 2
1.1.2 進階教程簡介 3
1.2 HTML、XHTML和HTML5 3
1.2.1 HTML和XHTML 3
1.2.2 HTML5 4
1.3 div和span 6
1.4 id和class 7
1.4.1 id屬性 7
1.4.2 class屬性 7
1.5 瀏覽器標題欄小圖示 8
第02章 語義化
2.1 語義化簡介 10
2.2 標應永嫌題語義化 12
2.3 圖片語義化 14
2.3.1 alt屬性和title屬性 14
2.3.2 figure元素和figcaption元素 15
2.4 表格語義化 16
2.5 表單語義化 19
2.5.1 label標籤 20
2.5.2 fieldset標籤和legend標籤 21
2.6 其他語義化 22
2.6.1 換行符 22
2.6.2 無序列表ul 24
2.6.3 strong標籤和em標籤 25
2.6.4 del標籤和ins標籤 25
2.6.5 img標籤 26
2.7 語義漏糊雄牛化驗證 26
2.8 HTML5捨棄的標籤 27
第 二部分 CSS進階
第03章 CSS基礎知識
3.1 CSS單位 30
3.1.1 **單位 30
3.1.2 相對單位 31
3.2 CSS特性 37
3.2.1 繼承性 37
3.2.2 層疊性 39
3.3 CSS優先權 40
3.3.1 引用方式衝突 41
3.3.2 繼承拜企方式衝突 41
3.3.3 指定樣式衝突 42
3.3.4 繼承樣式和指定樣式衝突 44
3.3.5 !important 45
3.4 CSS引入方式 47
3.4.1 外部樣式表 48
3.4.2 內部樣式表 48
3.4.3 行內樣式表 50
3.5 CSS選擇器 51
3.5.1 後代選擇器 51
3.5.2 子代選擇器 52
3.5.3 兄弟選擇器 54
3.5.4 相鄰選擇器 55
第04章 CSS規範
4.1 CSS規範簡介 58
4.2 命名規範 59
4.2.1 CSS檔案命名 59
4.2.2 id和class命名 59
4.3 書寫規範 62
4.4 注釋規範 65
4.4.1 頂部注釋 65
4.4.2 模組注釋 65
4.4.3 簡單注釋 65
4.5 CSS reset 66
4.5.1 什麼是CSS reset 66
4.5.2 為什麼要用CSS reset 66
4.5.3 如何使用CSS reset 67
第05章 盒子模型
5.1 CSS盒子模型 70
5.2 深入border 73
5.2.1 性能差異 74
5.2.2 兼容差異 74
5.3 深入padding 74
5.4 外邊距疊加 76
5.4.1 外邊距疊加的三種情況 77
5.4.2 外邊距疊加的意義 78
5.5 負margin技術 79
5.5.1 負margin簡介 79
5.5.2 負margin技巧 82
5.6 overflow 86
第06章 display屬性
6.1 塊元素和行內元素 90
6.1.1 塊元素 90
6.1.2 行內元素 92
6.2 display簡介 93
6.2.1 塊元素 93
6.2.2 inline元素 93
6.2.3 inline-block元素 94
6.3 display:none 95
6.3.1 display:none簡介 95
6.3.2 “戲汗抹display:none”和
“visibility:hidden”的區別 96
6.4 display:table-cell 98
6.4.1 圖片垂直居中於元素 98
6.4.2 等高旋去喇布局 100
6.4.3 自動平均劃分元素 102
6.5 去除inline-block元素間距 103
第07章 文本效果
7.1 文本效果簡介 107
7.2 深入text-indent 108
7.3 深入text-align 111
7.3.1 text-align起作用的元素 112
7.3.2 “text-align:center;”與
“margin:0 auto;”的區別 113
7.4 深入line-height 113
7.4.1 line-height的定義 113
7.4.2 line-height取值 115
7.5 深入vertical-align 118
7.5.1 vertical-align屬性取值 119
7.5.2 vertical-align屬性套用 121
第08章 表單效果
8.1 表單效果簡介 126
8.2 深入radio和checkbox 127
8.3 深入textarea 128
8.3.1 固定大小，禁用拖動 129
8.3.2 在chrome、Firefox和IE實現
相同的外觀 131
8.4 表單對齊 132
第09章 浮動布局
9.1 正常文檔流 136
9.1.1 正常文檔流 136
9.1.2 脫離文檔流 138
9.2 深入浮動 139
9.3 浮動的影響 142
9.3.1 對自身的影響 142
9.3.2 對父元素影響 143
9.3.3 對兄弟元素的影響 144
9.3.4 對子元素的影響 148
9.4 浮動的負作用 150
9.5 清除浮動 152
9.5.1 clear:both 152
9.5.2 overflow:hidden 154
9.5.3 ::after偽元素 155
第 10章 定位布局
10.1 深入定位 157
10.1.1 子元素相對父元素定位 157
10.1.2 子元素相對祖先元素定位 160
10.2 z-index屬性 162
第 11章 CSS圖形
11.1 CSS圖形簡介 165
11.2 三角形 166
11.2.1 CSS實現三角形的原理 166
11.2.2 帶框線的三角形 168
11.3 圓 172
11.3.1 CSS實現圓角 172
11.3.2 CSS實現半圓和圓 175
11.3.3 border-radius派生
子屬性 177
11.4 橢圓 177
第 12章 性能最佳化
12.1 CSS最佳化簡介 180
12.2 屬性縮寫 181
12.2.1 盒模型縮寫 181
12.2.2 背景縮寫 183
12.2.3 字型縮寫 184
12.2.4 顏色值縮寫 184
12.3 語法壓縮 185
12.3.1 空白符 185
12.3.2 結尾分號 186
12.3.3 url的引號 186
12.3.4 屬性值為0 187
12.3.5 屬性值為以0開頭的小數 187
12.3.6 合併相同的定義 187
12.3.7 利用繼承進行合併 188
12.4 壓縮工具 190
12.5 圖片壓縮 191
12.5.1 JPEG、PNG和GIF 191
12.5.2 圖片壓縮 191
12.6 高性能的選擇器 191
12.6.1 選擇器在瀏覽器的解析
原理 192
12.6.2 不同選擇器的解析速度 192
第 13章 CSS技巧
13.1 水平居中 194
13.1.1 文字的水平居中 194
13.1.2 元素的水平居中 195
13.2 垂直居中 198
13.2.1 文字的垂直居中 198
13.2.2 元素的垂直居中 200
13.3 CSS Sprite 203
13.4 Icon Font圖示 206
13.4.1 iconfont網站 207
13.4.2 icon font技術 209
第 14章 重要概念
14.1 CSS中的重要概念 214
14.2 包含塊 214
14.2.1 什麼是包含塊 214
14.2.2 包含塊的判定以及包含塊的
範圍 215
14.3 層疊上下文 216
14.3.1 什麼是層疊上下文？ 216
14.3.2 什麼是層疊級別？ 217
14.3.3 層疊上下文的特點 218
14.4 BFC和IFC 220
14.4.1 基本概念 220
14.4.2 什麼是BFC 221
14.4.3 BFC的用途 223
後記
3.5.3 兄弟選擇器 54
3.5.4 相鄰選擇器 55
第04章 CSS規範
4.1 CSS規範簡介 58
4.2 命名規範 59
4.2.1 CSS檔案命名 59
4.2.2 id和class命名 59
4.3 書寫規範 62
4.4 注釋規範 65
4.4.1 頂部注釋 65
4.4.2 模組注釋 65
4.4.3 簡單注釋 65
4.5 CSS reset 66
4.5.1 什麼是CSS reset 66
4.5.2 為什麼要用CSS reset 66
4.5.3 如何使用CSS reset 67
第05章 盒子模型
5.1 CSS盒子模型 70
5.2 深入border 73
5.2.1 性能差異 74
5.2.2 兼容差異 74
5.3 深入padding 74
5.4 外邊距疊加 76
5.4.1 外邊距疊加的三種情況 77
5.4.2 外邊距疊加的意義 78
5.5 負margin技術 79
5.5.1 負margin簡介 79
5.5.2 負margin技巧 82
5.6 overflow 86
第06章 display屬性
6.1 塊元素和行內元素 90
6.1.1 塊元素 90
6.1.2 行內元素 92
6.2 display簡介 93
6.2.1 塊元素 93
6.2.2 inline元素 93
6.2.3 inline-block元素 94
6.3 display:none 95
6.3.1 display:none簡介 95
6.3.2 “display:none”和
“visibility:hidden”的區別 96
6.4 display:table-cell 98
6.4.1 圖片垂直居中於元素 98
6.4.2 等高布局 100
6.4.3 自動平均劃分元素 102
6.5 去除inline-block元素間距 103
第07章 文本效果
7.1 文本效果簡介 107
7.2 深入text-indent 108
7.3 深入text-align 111
7.3.1 text-align起作用的元素 112
7.3.2 “text-align:center;”與
“margin:0 auto;”的區別 113
7.4 深入line-height 113
7.4.1 line-height的定義 113
7.4.2 line-height取值 115
7.5 深入vertical-align 118
7.5.1 vertical-align屬性取值 119
7.5.2 vertical-align屬性套用 121
第08章 表單效果
8.1 表單效果簡介 126
8.2 深入radio和checkbox 127
8.3 深入textarea 128
8.3.1 固定大小，禁用拖動 129
8.3.2 在chrome、Firefox和IE實現
相同的外觀 131
8.4 表單對齊 132
第09章 浮動布局
9.1 正常文檔流 136
9.1.1 正常文檔流 136
9.1.2 脫離文檔流 138
9.2 深入浮動 139
9.3 浮動的影響 142
9.3.1 對自身的影響 142
9.3.2 對父元素影響 143
9.3.3 對兄弟元素的影響 144
9.3.4 對子元素的影響 148
9.4 浮動的負作用 150
9.5 清除浮動 152
9.5.1 clear:both 152
9.5.2 overflow:hidden 154
9.5.3 ::after偽元素 155
第 10章 定位布局
10.1 深入定位 157
10.1.1 子元素相對父元素定位 157
10.1.2 子元素相對祖先元素定位 160
10.2 z-index屬性 162
第 11章 CSS圖形
11.1 CSS圖形簡介 165
11.2 三角形 166
11.2.1 CSS實現三角形的原理 166
11.2.2 帶框線的三角形 168
11.3 圓 172
11.3.1 CSS實現圓角 172
11.3.2 CSS實現半圓和圓 175
11.3.3 border-radius派生
子屬性 177
11.4 橢圓 177
第 12章 性能最佳化
12.1 CSS最佳化簡介 180
12.2 屬性縮寫 181
12.2.1 盒模型縮寫 181
12.2.2 背景縮寫 183
12.2.3 字型縮寫 184
12.2.4 顏色值縮寫 184
12.3 語法壓縮 185
12.3.1 空白符 185
12.3.2 結尾分號 186
12.3.3 url的引號 186
12.3.4 屬性值為0 187
12.3.5 屬性值為以0開頭的小數 187
12.3.6 合併相同的定義 187
12.3.7 利用繼承進行合併 188
12.4 壓縮工具 190
12.5 圖片壓縮 191
12.5.1 JPEG、PNG和GIF 191
12.5.2 圖片壓縮 191
12.6 高性能的選擇器 191
12.6.1 選擇器在瀏覽器的解析
原理 192
12.6.2 不同選擇器的解析速度 192
第 13章 CSS技巧
13.1 水平居中 194
13.1.1 文字的水平居中 194
13.1.2 元素的水平居中 195
13.2 垂直居中 198
13.2.1 文字的垂直居中 198
13.2.2 元素的垂直居中 200
13.3 CSS Sprite 203
13.4 Icon Font圖示 206
13.4.1 iconfont網站 207
13.4.2 icon font技術 209
第 14章 重要概念
14.1 CSS中的重要概念 214
14.2 包含塊 214
14.2.1 什麼是包含塊 214
14.2.2 包含塊的判定以及包含塊的
範圍 215
14.3 層疊上下文 216
14.3.1 什麼是層疊上下文？ 216
14.3.2 什麼是層疊級別？ 217
14.3.3 層疊上下文的特點 218
14.4 BFC和IFC 220
14.4.1 基本概念 220
14.4.2 什麼是BFC 221
14.4.3 BFC的用途 223
後記
