作者根據(jù)自己多年的網(wǎng)站開發(fā)及教學(xué)經(jīng)驗(yàn)，站在零基礎(chǔ)讀者的角度，詳細(xì)介紹了HTML和CSS的基礎(chǔ)知識(shí)，以及大量的前端開發(fā)技巧。 全書分為2大部分：第1部分是HTML基礎(chǔ)，主要介紹各種標(biāo)簽的使用；第二部分是CSS基礎(chǔ)，主要介紹樣式布局操作。此外，作者還結(jié)合實(shí)際工作及前端面試，精心挑選了大量高質(zhì)量的練習(xí)題放在每章*后，讀者可以邊學(xué)邊練，更好地掌握本書內(nèi)容。 本書提供了所有案例的源代碼、配套視頻課程，以及各種工具手冊(cè)。另外，為方便老師教學(xué)，還提供了配套的PPT教學(xué)課件。 本書適合零基礎(chǔ)的初學(xué)者使用，可以作為前端開發(fā)人員的參考書，也可作為培訓(xùn)學(xué)校、大中專院校相關(guān)專業(yè)的教學(xué)參考書。
源自閱讀量破6000萬的人氣教程 適合零基礎(chǔ)初學(xué)者，1小時(shí)快速上手，3天輕松入門 通俗易懂，風(fēng)趣幽默，原來前端還能這么好玩兒 每一節(jié)都配有微視頻，每一章都配有大量練習(xí) 同步視頻 配套練習(xí) 課件PPT 源碼素材 作者答疑 如果你需要的不是大而全，而是恰到好處的前端開發(fā)教程，那么不妨試著看一下這本書。本書源于作者在綠葉學(xué)習(xí)網(wǎng)分享的超人氣在線教程。由于教程的風(fēng)格獨(dú)一無二、質(zhì)量很高，因而累積獲得超過十萬讀者的支持。為了更好地幫助零基礎(chǔ)的小伙伴快速上手，每章后面都有習(xí)題，每一節(jié)都錄制了配套的高質(zhì)量視頻，小伙伴們可直接掃碼觀看。本書的配套資源包括：習(xí)題答案、源碼文件、配套PPT教學(xué)課件，以及各種工具手冊(cè)。
莫振杰，畢業(yè)于暨南大學(xué)信科院計(jì)算機(jī)科學(xué)與技術(shù)專業(yè)，從事前后端開發(fā)4年多，開發(fā)過綠葉學(xué)習(xí)網(wǎng)、廣州智能工程研究會(huì)網(wǎng)站、大量在線應(yīng)用工具及其他各種類型網(wǎng)站，著有多本編程書且銷量過萬， 現(xiàn)為綠葉學(xué)習(xí)網(wǎng)的站長，該網(wǎng)站用于分享其在前后端開發(fā)中的一些經(jīng)驗(yàn)，其制作的前后端開發(fā)在線教程在互聯(lián)網(wǎng)引起廣泛關(guān)注，每一個(gè)教程都廣受網(wǎng)友稱贊與推崇，今年還開發(fā)了系列前端線上付費(fèi)課程。
第 一部分 HTML 基礎(chǔ)
第 1 章 HTML 簡介 3
1.1 前端技術(shù)簡介 3
1.1.1 從網(wǎng)頁制作到前端開發(fā) 3
1.1.2 從前端開發(fā)到后端開發(fā) 4
1.1.3 學(xué)習(xí)路線 6
1.2 什么是HTML ？ 6
1.3 常見問題 7
第 2 章 開發(fā)工具 9
2.1 開發(fā)工具 9
2.2 使用HBuilder 10
第3 章 基本標(biāo)簽 13
3.1 HTML 結(jié)構(gòu) 13
3.2 head 標(biāo)簽 15
3.2.1 title 標(biāo)簽 15
3.2.2 meta 標(biāo)簽 16
3.2.3 style 標(biāo)簽 18
3.2.4 script 標(biāo)簽 18
3.2.5 link 標(biāo)簽 19
3.2.6 base 標(biāo)簽 19
3.3 body 標(biāo)簽 19
3.4 HTML 注釋 20
3.5 本章練習(xí) 21
第4 章 文本 22
4.1 文本簡介 22
4.1.1 頁面組成元素 22
4.1.2 HTML 文本 23
4.2 標(biāo)題標(biāo)簽 24
4.3 段落標(biāo)簽 26
4.3.1 段落標(biāo)簽
26
4.3.2 換行標(biāo)簽
27
4.4 文本標(biāo)簽 29
4.4.1 粗體標(biāo)簽 29
4.4.2 斜體標(biāo)簽 30
4.4.3 上標(biāo)標(biāo)簽 31
4.4.4 下標(biāo)標(biāo)簽 31
4.4.5 中劃線標(biāo)簽 32
4.4.6 下劃線標(biāo)簽 33
4.4.7 大字號(hào)標(biāo)簽和小字號(hào)標(biāo)簽 33
4.5 水平線標(biāo)簽 34
4.6 div 標(biāo)簽 35
4.7 自閉合標(biāo)簽 37
4.8 塊元素和行內(nèi)元素 38
4.8.1 塊元素 38
4.8.2 行內(nèi)元素 40
4.9 特殊符號(hào) 40
4.9.1 網(wǎng)頁中的空格 40
4.9.2 網(wǎng)頁中的特殊符號(hào) 42
4.10 本章練習(xí) 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 本章練習(xí) 56
第6 章 表格 57
6.1 表格簡介 57
6.2 基本結(jié)構(gòu) 57
6.3 完整結(jié)構(gòu) 59
6.3.1 表格標(biāo)題：caption 59
6.3.2 表頭單元格：th 60
6.4 語義化 62
6.5 合并行：rowspan 65
6.6 合并列：colspan 66
6.7 本章練習(xí) 67
第7 章 圖片 68
7.1 圖片標(biāo)簽 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 本章練習(xí) 78
第8 章 超鏈接 80
8.1 超鏈接簡介 80
8.1.1 a 標(biāo)簽 80
8.1.2 target 屬性 82
8.2 內(nèi)部鏈接 83
8.3 錨點(diǎn)鏈接 84
8.4 本章練習(xí) 87
第9 章 表單 88
9.1 表單簡介 88
9.1.1 表單是什么？ 88
9.1.2 表單標(biāo)簽 89
9.2 form 標(biāo)簽 90
9.2.1 form 標(biāo)簽簡介 90
9.2.2 form 標(biāo)簽屬性 91
9.3 input 標(biāo)簽 92
9.4 單行文本框 93
9.4.1 單行文本框簡介 93
9.4.2 單行文本框?qū)傩浴?3
9.5 密碼文本框 95
9.5.1 密碼文本框簡介 95
9.5.2 密碼文本框?qū)傩浴?7
9.6 單選框 98
9.6.1 單選框簡介 98
9.6.2 忽略點(diǎn) 99
9.7 復(fù)選框 102
9.8 按鈕 104
9.8.1 普通按鈕button 104
9.8.2 提交按鈕submit 105
9.8.3 重置按鈕reset 106
9.8.4 button 標(biāo)簽 108
9.9 文件上傳 108
9.10 多行文本框 109
9.11 下拉列表 110
9.11.1 下拉列表簡介 110
9.11.2 select 標(biāo)簽屬性 111
9.11.3 option 標(biāo)簽屬性 113
9.13 本章練習(xí) 115
第 10 章 框架 117
10.1 iframe 標(biāo)簽 117
10.2 練習(xí)題 118
第二部分 CSS 基礎(chǔ)
第 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 內(nèi)部樣式表 123
11.3.3 行內(nèi)樣式表 124
11.3 本章練習(xí) 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 本章練習(xí) 138
第 13 章 字體樣式 139
13.1 字體樣式簡介 139
13.2 字體類型：font-family 140
13.3 字體大�。篺ont-size 141
13.3.1 px 是什么？ 142
13.3.2 采用px 為單位 142
13.4 字體粗細(xì)：font-weight 143
13.5 字體風(fēng)格：font-style 145
13.6 字體顏色：color 146
13.6.1 關(guān)鍵字 146
13.6.2 16 進(jìn)制RGB 值 147
13.7 CSS 注釋 148
13.8 本章練習(xí) 150
第 14 章 文本樣式 152
14.1 文本樣式簡介 152
14.2 首行縮進(jìn)：text-indent 152
14.3 水平對(duì)齊：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 本章練習(xí) 162
第 15 章 邊框樣式 163
15.1 邊框樣式簡介 163
15.2 整體樣式 164
15.2.1 邊框的屬性 164
15.2.2 簡寫形式 166
15.3 局部樣式 167
15.4 本章練習(xí) 170
第 16 章 列表樣式 171
16.1 列表項(xiàng)符號(hào)：list-style-type 171
16.1.1 定義列表項(xiàng)符號(hào) 171
16.1.2 去除列表項(xiàng)符號(hào) 173
16.2 列表項(xiàng)圖片：list-style-image 174
16.3 本章練習(xí) 176
第 17 章 表格樣式 177
17.1 表格標(biāo)題位置：caption-side 177
17.2 表格邊框合并：border-collapse 179
17.3 表格邊框間距：border-spacing 180
17.4 本章練習(xí) 182
第 18 章 圖片樣式 183
18.1 圖片大小 183
18.2 圖片邊框 184
18.3 圖片對(duì)齊 185
18.3.1 水平對(duì)齊 185
18.3.2 垂直對(duì)齊 187
18.4 文字環(huán)繞：float 189
18.5 本章練習(xí) 191
第 19 章 背景樣式 192
19.1 背景樣式簡介 192
19.2 背景顏色：background-color 192
19.3 背景圖片樣式：background-image 194
19.4 背景圖片重復(fù)：background-repeat 196
19.5 背景圖片位置：background-position 198
19.5.1 像素值 198
19.5.2 關(guān)鍵字 199
19.6 背景圖片固定：background-attachment 201
19.7 本章練習(xí) 202
第 20 章 超鏈接樣式 203
20.1 超鏈接偽類 203
20.1.1 超鏈接偽類簡介 203
20.1.2 深入了解超鏈接偽類 205
20.2 深入了解:hover 206
20.3 鼠標(biāo)樣式 208
20.3.1 瀏覽器鼠標(biāo)樣式 208
20.3.2 自定義鼠標(biāo)樣式 209
20.4 本章練習(xí) 210
第 21 章 盒子模型 212
21.1 CSS 盒子模型 212
21.2 寬高：width、height 215
21.3 邊框：border 218
21.4 內(nèi)邊距：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 本章練習(xí) 228
第 22 章 浮動(dòng)布局 230
22.1 文檔流簡介 230
22.1.1 正常文檔流 230
22.1.2 脫離文檔流 231
22.2 浮動(dòng) 233
22.3 清除浮動(dòng) 236
22.4 本章練習(xí) 238
第 23 章 定位布局 240
23.1 定位布局簡介 240
23.2 固定定位：fixed 240
23.3 相對(duì)定位：relative 243
23.4 絕對(duì)定位：absolute 245
23.5 靜態(tài)定位：static 247
23.6 本章練習(xí) 248
附錄A HTML 常用標(biāo)簽 249
附錄B 常用表單標(biāo)簽 251
附錄C CSS 常用屬性 252
附錄D W3C 十六色 254
書單推薦
