第1章 探本溯源，前端開發(fā)基礎漫談

1.1 前端開發(fā)是做什么的2

1.2 前端開發(fā)技術(shù)5

1.2.1 HTML超文本標記語言：搭建網(wǎng)頁結(jié)構(gòu)5

1.2.2 CSS層疊樣式表：給網(wǎng)頁添加樣式6

1.2.3 JavaScript：讓網(wǎng)頁響應某種行為6

1.3 前端開發(fā)所需軟件7

1.3.1 Photoshop8

1.3.2 編輯器11

1.3.3 瀏覽器12

1.4 第一個HTML頁面12

1.4.1 基本標記標簽13

1.4.2 標簽嵌套關(guān)系19

1.5 標簽簡介19

練習題20

第2章 CSS基礎語法、選擇器和樣式?jīng)_突的解決方案

2.1 CSS概述22

2.2 定義CSS的基本語法23

2.3 基本選擇器25

2.3.1 元素選擇器25

2.3.2 ID選擇器26

2.3.3 類選擇器29

2.3.4 偽類選擇器33

2.3.5 偽元素選擇器35

2.3.6 通用選擇器38

2.4 復合選擇器39

2.4.1 交集選擇器39

2.4.2 并集選擇器40

2.4.3 后代選擇器41

2.4.4 子元素選擇器43

2.4.5 相鄰兄弟選擇器44

2.4.6 屬性選擇器45

2.5 CSS選擇器的使用方法47

2.6 CSS應用到HTML頁面的常用方式47

2.6.1 行內(nèi)式47

2.6.2 內(nèi)嵌式48

2.6.3 鏈接式49

2.7 CSS的沖突與解決50

練習題53

第3章 網(wǎng)頁排版利器：CSS 字體、文本、背景屬性設置

3.1 字體屬性55

3.1.1 字體粗細屬性：font-weight55

3.1.2 字體風格屬性：font-style56

3.1.3 字體大小屬性：font-size58

3.1.4 字體族屬性：font-family59

3.1.5 文本行高屬性：line-height62

3.1.6 字體屬性：font65

3.2 文本屬性66

3.2.1 顏色屬性：color66

3.2.2 水平對齊屬性：text-align69

3.2.3 首行縮進屬性：text-indent70

3.2.4 文本修飾屬性：text-decoration71

3.2.5 字符間距屬性：letter-spacing73

3.2.6 字間距屬性：word-spacing74

3.3 背景屬性75

3.3.1 背景顏色屬性：background-color75

3.3.2 背景圖片屬性：background-image76

3.3.3 背景圖片重復屬性：background-repeat77

3.3.4 背景圖片位置屬性：background- position79

3.3.5 背景圖片滾動屬性：background-attachment81

3.3.6 背景屬性：background83

練習題84

第4章 剖析盒模型特性，詳解布局方寸間的邏輯關(guān)系

4.1 盒子模型的組成86

4.2 盒子邊框（border）設置88

4.2.1 設置邊框風格88

4.2.2 設置邊框?qū)挾?0

4.2.3 設置邊框顏色93

4.2.4 統(tǒng)一設置邊框的寬度、顏色和風格95

4.2.5 邊框的形狀98

4.3 盒子內(nèi)邊距（padding）設置100

4.3.1 內(nèi)邊距的設置100

4.3.2 padding內(nèi)邊距的特點103

4.4 盒子外邊距（margin）設置105

4.4.1 外邊距的設置105

4.4.2 盒子外邊距合并107

4.4.3 相鄰盒子之間的水平間距113

練習題116

第5章 世界是多樣化的，標簽是語義化的

5.1 常用文本標簽118

5.1.1 段落與換行標簽118

5.1.2 標題字標簽119

5.1.3 標簽121

5.1.4 標簽122

5.1.5 標簽122

5.1.6 < time>標簽123

5.1.7 標簽124

5.1.8 空格和特殊字符的輸入124

5.2 文檔結(jié)構(gòu)標簽126

5.2.1

標簽127

5.2.2 < article>標簽128

5.2.3

標簽129

5.2.4 < main>標簽130

5.2.5