實踐性強 每個重要知識點都配有例題講解，且在每章最后配有一個綜合實例，使讀者對每章知識點有一個全局性的把握。

課后習題豐富 每章均配有豐富的課后練習題，不僅包括對理論知識進行考察的習題，還包括對實踐能力進行檢驗的實訓練習，便于理論聯系實際，進行綜合考察。

豐富實用的資源 提供電子教案、實例源代碼、素材圖片、課后習題答案等。

內容設計面廣 即可作為高職院校或大專院校相關專業教材，也可作為Web前端開發人員、網站建設人員的參考書，還可作為各類電腦職業培訓教材。

HTML和CSS是網頁制作的基礎語言，是每個網頁制作者必須掌握的內容。Web標準是所有網頁前臺技術的發展方向，本書針對Web開發系統，系統、全面地介紹了各種HTML網頁制作標記、語法、說明和范例，強化CSS應用技巧講解。應用CSS制作頁面比傳統的屬性標簽更漂亮，更便于與后臺結合。

本書不僅包含了網頁前臺技術的各種概念和理論知識，而且對多種知識的綜合運用進行了詳細的講解。知識點系統連貫，邏輯性強；重點難點突出，利于組織教學；在內容安排上注意承上啟下，由簡到繁，循序漸進地講述網頁前臺技術，從基本概念到具體實踐、從頁面結構建設到頁面布局都進行了詳細闡述，并進行了細致的實例講解。

本書共分為11章，分別介紹了：HTML、CSS網頁設計概述；HTML基礎，包括HTML代碼的結構、HTML網頁的構成；HTML網頁頭部標記；HTML網頁主體與內容標記，包括標題與段落標記的使用、文本格式標記的使用；使用CSS樣式，包括CSS樣式代碼編寫規則、CSS樣式選擇器；HTML網頁中的圖片；創建超鏈接；創建表格，包括表格基礎標記、創建高級表格；創建表單；對表格與表單應用CSS樣式；使用CSS樣式完成網頁布局。

HTML與CSS前臺頁面設計是一門實踐性較強的課程，需要通過大量的上機實踐去熟悉HTML與CSS的各種標記，掌握這些標記的靈活應用，所以本書每個重要的知識點都配有例題講解。在每章最后還有一個綜合的實例講解，該實例對本章的知識點進行了綜合應用，使讀者對每章知識點有一個全局性的把握。

各章后的練習不僅包括對理論知識進行考察的習題，還包括對實踐能力進行檢驗的實訓練習。這樣便于理論聯系實際，進行綜合考察。

在HTML與CSS中涉及了大量的標記，為了讓讀者在需要的時候能夠快速地查閱到相關標記的使用，本書提供了一組附錄，其中可以查到HTML與CSS的一些標記的使用，以及網頁設計中用到的單位和Web顏色。

本書由許莉任主編，李唯、汪曉青任副主編，王路群主審，參與本書編寫的還有李漢橋、董寧、馬力、謝日星、魯娟、夏敏、肖靜、侯自力等。對于在本書編寫過程中提供了支持和幫助的所有人，在此表示衷心的感謝。

由于時間倉促及作者水平有限，書中不足之處在所難免，懇請廣大讀者、專家批評指正。

編 者

2010年10月

前言

第1章 HTML與CSS網頁設計概述 1
1.1 HTML的基本概念 1
1.1.1 什么是HTML 1
1.1.2 HTML的發展 1
1.1.3 HTML與XHTML 2
1.2 CSS的基本概念 2
1.2.1 什么是CSS 2
1.2.2 CSS在網頁設計中的作用 2
1.3 網頁與網站 3
1.3.1 網頁與網站的關系 3
1.3.2 建立網站 3
1.3.3 URL簡介 3
1.3.4 HTML與CSS網頁的開發環境 4
本章小結 6
習題一 6
第2章 HTML基礎 7
2.1 HTML代碼的結構 7
2.1.1 HTML代碼的組成 7
2.1.2 注釋與空白符 8
2.1.3 標記的嵌套 9
2.1.4 標準屬性 9
2.1.5 XHTML 9
2.2 HTML網頁的構成 10
2.2.1 HTML網頁結構 10
2.2.2 HTML標記及其屬性 10
2.2.3 head標記及其屬性 11
2.2.4 body標記及其屬性 14
2.3 HTML網頁的瀏覽與測試 17
2.3.1 利用IE與Firefox瀏覽HTML網頁 17
2.3.2 利用Firebug測試HTML網頁 18
2.4 綜合實例 19
本章小結 20
習題二 20
實訓 21
第3章 HTML網頁頭部標記 22
3.1 title標記及其屬性 22
3.2 base標記及其屬性 23
3.3 meta標記及其屬性 23
3.4 link標記及其屬性 25
3.5 style標記及其屬性 26
3.6 script標記及其屬性 27
3.7 綜合實例 28
本章小結 28
習題三 29
實訓 29
第4章 HTML網頁主體與內容標記 30
4.1 標題與段落標記的使用 30
4.1.1 h1、h2、h3、h4、h5與h6 30
4.1.2 p 31
4.1.3 blockquote 32
4.1.4 address 32
4.1.5 pre 33
4.2 文本格式標記的使用 34
4.2.1 em 34
4.2.2 strong 34
4.2.3 cite 34
4.2.4 i與b 35
4.2.5 big與small 35
4.2.6 tt 35
4.2.7 sup與sub 36
4.2.8 q 36
4.2.9 dfn 37
4.2.10 abbr與acronym 37
4.2.11 del與ins 38
4.2.12 bdo 38
4.2.13 code、kbd、samp與var 39
4.2.14 hr 40
4.2.15 marquee 41
4.3 內容（多用途）標記 42
4.3.1 div 42
4.3.2 span 43
4.4 特殊字符 44
4.5 綜合實例 46
本章小結 48
習題四 48
實訓 49
第5章 使用CSS樣式 50
5.1 對HTML文檔應用樣式 50
5.1.1 應用樣式的方法 50
5.1.2 應用樣式的優先級 52
5.2 CSS樣式代碼編寫規則 53
5.2.1 基本語法 53
5.2.2 規則的注釋 53
5.2.3 規則的標記 54
5.2.4 規則的排版 54
5.2.5 樣式命名的通用規則 55
5.3 CSS樣式選擇器 55
5.3.1 HTML標記選擇器 55
5.3.2 class選擇器 55
5.3.3 ID選擇器 58
5.3.4 高級選擇器 59
5.3.5 樣式的優先級 66
5.4 綜合實例 67
本章小結 69
習題五 69
實訓 70
第6章 HTML網頁中的圖片 71
6.1 在網頁中加入圖片 71
6.2 圖片與文字的排版 77
6.3 網頁背景圖片 79
6.4 利用CSS樣式在網頁中加入圖片 80
6.5 綜合實例 84
本章小結 86
習題六 86
實訓 86
第7章 創建超鏈接 88
7.1 超鏈接概述 88
7.2 超鏈接標記及其屬性 89
7.2.1 內部鏈接 91
7.2.2 書簽鏈接 92
7.2.3 外部鏈接 95
7.2.4 文件（非HTML頁面）鏈接 99
7.3 利用CSS樣式設置書簽格式 100
7.4 圖片鏈接 102
7.5 圖片映射鏈接 104
7.6 綜合實例 107
本章小結 109
習題七 109
實訓 109
第8章 創建表格 111
8.1 表格基礎標記 111
8.2 創建簡單表格 111
8.3 表格的屬性 113
8.4 表格高級標記 128
8.4.1 th 128
8.4.2 caption 129
8.4.3 thead、tbody、tfoot 130
8.4.4 colgroup 132
8.4.5 colspan和rowspan 133
8.5 創建高級表格 135
8.6 綜合實例 136
本章小結 138
習題八 138
實訓 139
第9章 創建表單 140
9.1 表單的作用 140
9.2 表單標記 140
9.2.1 form 140
9.2.2 input 142
9.2.3 textarea 149
9.2.4 select和option 150
9.2.5 optgroup 152
9.3 表單布局標記 153
9.3.1 fieldset和legend 153
9.3.2 label 155
9.4 綜合實例 156
本章小結 157
習題九 158
實訓 158
第10章 對表格與表單應用CSS樣式 159
10.1 利用CSS樣式構建美觀的數據表格 159
10.1.1 表格標記 159
10.1.2 對表格應用樣式 163
10.2 CSS樣式在表單中的應用 174
10.2.1 表單標記 174
10.2.2 表單布局 175
10.2.3 修飾表單 178
10.2.4 復雜的表單布局 181
10.3 綜合實例 185
本章小結 189
習題十 189
實訓 190
第11章 使用CSS樣式完成網頁布局 191
11.1 CSS網頁布局介紹 191
11.1.1 CSS網頁布局的意義 191
11.1.2 CSS盒模型 192
11.1.3 CSS網頁布局的基本思路 193
11.2 網頁居中 194
11.2.1 自動空白邊居中設計 194
11.2.2 定位居中設計 196
11.3 基于float的網頁布局 197
11.3.1 兩列布局 197
11.3.2 多列布局 201
11.4 復雜布局 205
11.4.1 動態布局 205
11.4.2 彈性布局 207
11.4.3 動態－彈性混合布局 209
11.4.4 動態和彈性圖像 211
11.4.5 偽列布局 212
11.5 綜合實例 213
本章小結 216
習題十一 217
實訓 217
附錄A 習題答案 218
附錄B HTML標記 223
附錄C CSS屬性 227
附錄D CSS單位 239
附錄E Web顏色 240
參考文獻 242

1. 網頁設計與制作實驗指導 [主編　鄧文鋒 利珊]
2. 網頁設計與制作 [主編　溫凱峰 葉仕通]
3. 網站前端技術案例教程（HTML+CSS+JavaScript）（第二版） [黃華升]
4. 網頁設計與制作 [主編 王瀟 章明珠]
5. 網頁設計與制作 [主編 李佼輝 聶樹成]
6. HTML5+CSS3前端開發項目式教程（微課版） [主編 譚衛 徐文義]
7. Web前端開發從學到用完美實踐HTML5+CSS3+JavaScript+jQuery+AJAX+AngularJS（第2版） [阮曉龍]
8. HTML5動畫創作技術—DragonBones [陳菲儀 劉枝秀 編著]
9. HTML5游戲開發技術—Egret Engine [辛子俊 林雪瑩]
10. 網站前端技術案例教程（HTML+CSS+JavaScript） [黃華升]
11. 網頁設計與制作 [主編 楊毅]
12. HTML5應用開發與實戰 [主編 肖睿 于繼武]
13. 網頁設計與制作 [主編 陳建國 項煒]
14. 16課學會網頁程序設計—— HTML5+CSS3+JavaScript+jQuery+ [施威銘研究室 著]
15. Web前端開發HTML5+CSS3+jQuery+AJAX從學到用完美實踐 [阮曉龍 耿方方 許成剛]
16. HTML5+CSS3前端技術——UI設計師與開發人員合作秘籍 [北京課工場教育科技有限公司Q]
17. 網頁設計與制作 [孫娜 蒲秋梅 南洋 編著]
18. CSS+DIV頁面布局技術 [主編 朱翠苗]
19. 網頁設計與制作 [王鐵樁 聶衛獻]
20. 網頁設計實訓教程 [主編 張春英 李英文 鐘大偉]
21. 網頁設計與開發實戰教程 [李云程]
22. 網頁設計與制作項目化教程 [周觀民 梁雪梅]
23. CSS+DIV頁面布局技術 [朱翠苗]
24. 網頁設計與制作項目案例教程（Dreamweaver CS6） [楊麗芳 劉琳]
25. 腳本語言與動態網頁設計（第二版） [主 編 張景峰 王培軍]
26. 網頁設計實用技術 [主 編 陳建國 李勤]
27. 網頁設計與制作（第二版） [馬占欣]
28. 動態網頁設計與制作實用教程（第三版） [程偉淵 倪燃]
29. 網頁設計與制作實用技術（第二版） [齊建玲 楊艷杰]
30. 多媒體網頁設計教程 [主編 朱國華 齊暉 李楓]