作者根據(jù)自己多年的網(wǎng)站開發(fā)及教學經(jīng)驗,站在零基礎讀者的角度,詳細介紹了HTML和CSS的基礎知識,以及大量的前端開發(fā)技巧。 全書分為2大部分:第1部分是HTML基礎,主要介紹各種標簽的使用;第二部分是CSS基礎,主要介紹樣式布局操作。此外,作者還結(jié)合實際工作及前端面試,精心挑選了大量高質(zhì)量的練習題放在每章*后,讀者可以邊學邊練,更好地掌握本書內(nèi)容。 本書提供了所有案例的源代碼、配套視頻課程,以及各種工具手冊。另外,為方便老師教學,還提供了配套的PPT教學課件。 本書適合零基礎的初學者使用,可以作為前端開發(fā)人員的參考書,也可作為培訓學校、大中專院校相關專業(yè)的教學參考書。
源自閱讀量破6000萬的人氣教程 適合零基礎初學者,1小時快速上手,3天輕松入門 通俗易懂,風趣幽默,原來前端還能這么好玩兒 每一節(jié)都配有微視頻,每一章都配有大量練習 同步視頻 配套練習 課件PPT 源碼素材 作者答疑 如果你需要的不是大而全,而是恰到好處的前端開發(fā)教程,那么不妨試著看一下這本書。本書源于作者在綠葉學習網(wǎng)分享的超人氣在線教程。由于教程的風格獨一無二、質(zhì)量很高,因而累積獲得超過十萬讀者的支持。為了更好地幫助零基礎的小伙伴快速上手,每章后面都有習題,每一節(jié)都錄制了配套的高質(zhì)量視頻,小伙伴們可直接掃碼觀看。本書的配套資源包括:習題答案、源碼文件、配套PPT教學課件,以及各種工具手冊。
莫振杰,畢業(yè)于暨南大學信科院計算機科學與技術(shù)專業(yè),從事前后端開發(fā)4年多,開發(fā)過綠葉學習網(wǎng)、廣州智能工程研究會網(wǎng)站、大量在線應用工具及其他各種類型網(wǎng)站,著有多本編程書且銷量過萬, 現(xiàn)為綠葉學習網(wǎng)的站長,該網(wǎng)站用于分享其在前后端開發(fā)中的一些經(jīng)驗,其制作的前后端開發(fā)在線教程在互聯(lián)網(wǎng)引起廣泛關注,每一個教程都廣受網(wǎng)友稱贊與推崇,今年還開發(fā)了系列前端線上付費課程。
第 一部分 HTML 基礎
第 1 章 HTML 簡介 3
1.1 前端技術(shù)簡介 3
1.1.1 從網(wǎng)頁制作到前端開發(fā) 3
1.1.2 從前端開發(fā)到后端開發(fā) 4
1.1.3 學習路線 6
1.2 什么是HTML ? 6
1.3 常見問題 7
第 2 章 開發(fā)工具 9
2.1 開發(fā)工具 9
2.2 使用HBuilder 10
第3 章 基本標簽 13
3.1 HTML 結(jié)構(gòu) 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 塊元素和行內(nèi)元素 38
4.8.1 塊元素 38
4.8.2 行內(nèi)元素 40
4.9 特殊符號 40
4.9.1 網(wǎng)頁中的空格 40
4.9.2 網(wǎng)頁中的特殊符號 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 基本結(jié)構(gòu) 57
6.3 完整結(jié)構(gòu) 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 內(nèi)部鏈接 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 單行文本框?qū)傩浴?3
9.5 密碼文本框 95
9.5.1 密碼文本框簡介 95
9.5.2 密碼文本框?qū)傩浴?7
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 內(nèi)部樣式表 123
11.3.3 行內(nèi)樣式表 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 字體大。篺ont-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 文字環(huán)繞: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 內(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 本章練習 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 靜態(tài)定位:static 247
23.6 本章練習 248
附錄A HTML 常用標簽 249
附錄B 常用表單標簽 251
附錄C CSS 常用屬性 252
附錄D W3C 十六色 254