購買商店

HTML + CSS 網站設計與開發從新手到高手

$474.00

馬上購買

內容描述

《HTML+CSS網站設計與開發從新手到高手》緊密圍繞網頁設計師在網頁製作過程中的實際需要和應該掌握的技術，全面地介紹了使用HTML和CSS進行網頁設計和製作的內容和技巧。《HTML+CSS網站設計與開發從新手到高手》不僅註重語法講解，還通過一個個鮮活、典型的案例來幫助讀者達到學以致用的目的。每個語法都有對應的實例，大多數章還配有綜合實例，力求達到理論知識與實踐操作的完美結合。 《HTML+CSS網站設計與開發從新手到高手》可作為普通高校、高職高專院校電腦及相關專業的教材，也可供從事網頁設計與製作、網站開發、網頁編程等行業人員參考

目錄大綱

目錄
第1 章　HTML 5 入門  001
1.1 認識HTML 5  001
1.2 HTML 5 的新特性  003
1.3 HTML 5 與HTML 4 的區別  004
1.3.1 HTML 5 的語法變化 … 004
1.3.2 HTML 5 中的標記方法  005
1.3.3 HTML 5 語法中的3 個要點 005
1.4 新增的主體結構元素 … 006
1.4.1 article 元素 … 006
1.4.2 section 元素  008
1.4.3 nav 元素  009
1.4.4 aside 元素 … 011
1.5 新增的非主體結構元素  012
1.5.1 header 元素  012
1.5.2 hgroup 元素  013
1.5.3 footer 元素 … 014
1.5.4 address 元素  015
1.6 本章小結  016
第2 章　用HTML 設置文字與段落格式 … 017
2.1 HTML 頁面主體常用設置 … 017
2.1.1 定義網頁背景色：bgcolor 017
2.1.2 設置背景圖片：background 018
2.1.3 設置文字顏色：text … 019
2.1.4 設置鏈接文字屬性 … 020
2.1.5 設置頁面邊距 … 022
2.2 頁面頭部元素 和<!doctype> … 023
2.3 頁面標題元素 … 024
2.4 插入其他標記  024
2.4.1 輸入空格符號 … 025
2.4.2 輸入特殊符號 … 025
2.5 設置文字的格式 … 026
2.5.1 字體：face … 026
2.5.2 字號：size … 027
2.5.3 文字顏色：color  028
2.5.4 粗體、斜體、下畫線：b、strong、i、em、cite、u … 029
2.5.5 上標與下標：sup、sub  030
2.5.6 多種標題樣式：

 ～

 … 031
2.6 設置段落的排版與換行  032
2.6.1 為文字分段：p … 032
2.6.2 段落的對齊屬性：align … 033
2.6.3 不換行標記：nobr  034
2.6.4 換行標記：br  035
2.7 水平線標記 … 035
2.7.1 插入水平線：hr … 036
2.7.2 水平線的寬度與高度：width、size  036
2.7.3 水平線的顏色：color  037
2.7.4 水平線的對齊方式：align 038
2.7.5 去掉水平線陰影：noshade 039
2.8 綜合實例—設置頁面文本及段落  040
2.9 本章小結  042
第3 章　用HTML 創建精彩的圖像和多媒體頁面 … 043
3.1 網頁中常見的圖像格式  043
3.2 插入圖像並設置圖像屬性 … 044
3.2.1 圖像標記：img … 044
3.2.2 圖像高度：height  045
3.2.3 圖像寬度：width  046
3.2.4 圖像的邊框：border … 046
3.2.5 圖像水平間距：hspace  047
3.2.6 圖像垂直間距：vspace  048
3.2.7 圖像相對於文字的對齊方式：align … 049
3.2.8 圖像的替代文字：alt  050
3.3 音頻和視頻 … 051
3.3.1 使用embed  051
3.3.2 使用video … 052
3.4 綜合實例—創建多媒體網頁 … 054
3.5 本章小結  055
第4 章　用HTML 創建超鏈接 … 056
4.1 超鏈接和路徑  056
4.1.1 超鏈接的概念 … 056
4.1.2 路徑URL … 056
4.1.3 HTTP 路徑 … 057
4.1.4 FTP 路徑 … 058
4.1.5 郵件路徑 … 059
4.2 鏈接元素  060
4.2.1 指定路徑屬性href  060
4.2.2 顯示鏈接目標屬性target … 061
4.2.3 鏈接的熱鍵屬性accesskey 062
4.3 創建圖像的超鏈接  064
4.3.1 創建鏈接區域元素 064
4.3.2 鏈接區域的名稱屬性name 064
4.3.3 定義鼠標敏感區元素 065
4.3.4 鏈接的路徑屬性href、nohref … 066
4.3.5 鼠標敏感區坐標屬性coords 067
4.4 創建錨點鏈接  069
4.5 綜合實例—為網頁添加鏈接 … 070
4.6 本章小結  072
第5 章　使用HTML 創建表格… 073
5.1 創建並設置表格屬性 … 073
5.1.1 表格的基本標記：table、tr、td … 073
5.1.2 表格寬度和高度：width、height … 074
5.1.3 表格的標題：caption  075
5.1.4 表格的表頭：th … 077
5.1.5 表格對齊方式：align  078
5.1.6 表格的邊框寬度：border … 080
5.1.7 表格的邊框顏色：bordercolor … 081
5.1.8 單元格間距：cellspacing … 082
5.1.9 單元格邊距：cellpadding … 083
5.1.10 表格的背景色：bgcolor … 084
5.1.11 表格的背景圖像：background  085
5.2 表格的結構標記 … 086
5.2.1 設計表頭樣式：thead  086
5.2.2 設計表主體樣式：tbody … 088
5.2.3 設計表尾樣式：tfoot… 089
5.3 綜合實例—使用表格排版網頁 091
5.4 本章小結  095
第6 章　創建交互式表單  096
6.1 表單元素 … 096
6.1.1 動作屬性action … 096
6.1.2 發送數據方式屬性method 097
6.1.3 名稱屬性name … 097
6.2 表單對象 … 098
6.2.1 文本域text … 099
6.2.2 密碼域password  100
6.2.3 提交按鈕submit  101
6.2.4 復位按鈕reset … 102
6.2.5 圖像域image  102
6.2.6 普通按鈕button … 103
6.2.7 復選框checkbox  104
6.2.8 單選按鈕radio … 105
6.2.9 隱藏域hidden … 106
6.3 綜合實例—用戶註冊表單頁面 … 107
6.4 本章小結  112
第7 章　HTML 5 繪圖Canvas 和SVG … 113
7.1 Canvas 繪制基本圖形 … 113
7.1.1 Canvas 元素  113
7.1.2 繪制直線 … 114
7.1.3 繪制矩形 … 115
7.1.4 繪制三角形  118
7.1.5 繪制圓弧 … 119
7.1.6 繪制貝塞爾曲線  120
7.2 顏色和樣式選項 … 121
7.2.1 應用不同的線型  121
7.2.2 繪制線性漸變 … 123
7.2.3 繪制徑向漸變 … 125
7.3　變換  126
7.3.1 平移變換 … 127
7.3.2 縮放變換 … 128
7.3.3 旋轉變換 … 129
7.4 SVG  129
7.4.1 圖形繪制 … 130
7.4.2 文本與圖像  133
7.4.3 筆畫與填充  134
7.5 綜合實例—繪制精美時鐘  134
7.6 本章小結  137
第8 章　CSS 基礎知識 … 138
8.1 CSS 3 簡介 … 138
8.1.1 CSS 基本概念 … 138
8.1.2 CSS 的優點  139
8.1.3 CSS 功能 … 140
8.1.4 CSS 發展史  140
8.2 在HTML 5 中使用CSS  141
8.2.1 行內樣式 … 141
8.2.2 內嵌樣式 … 142
8.2.3 鏈接樣式 … 143
8.2.4 導入樣式 … 144
8.2.5 優先級問題  144
8.3 選擇器類型 … 145
8.3.1　標簽選擇器  145
8.3.2　類選擇器 … 145
8.3.3　ID 選擇器 … 147
8.4 編輯和瀏覽CSS … 148
8.4.1 手工編寫CSS … 148
8.4.2 利用Dreamweaver 編寫CSS 149
8.5 綜合實例—對網頁添加CSS 樣式 150
8.6 本章小結  152
第9 章　CSS 控制網頁文本和段落樣式  153
9.1 通過CSS 控制文本樣式  153
9.1.1　字體font-family … 153
9.1.2　字號font-size  154
9.1.3　加粗字體font-weight  156
9.1.4　字體風格font-style … 157
9.1.5　小寫字母轉換為大寫字母font-variant … 159
9.2　通過CSS 控制段落樣式  160
9.2.1 單詞間隔word-spacing  160
9.2.2 字符間隔letter-spacing  161
9.2.3 文字修飾text-decoration … 161
9.2.4 垂直對齊方式vertical-align 162
9.2.5 文本轉換text-transform … 163
9.2.6 水平對齊方式text-align … 164
9.2.7 文本縮進text-indent … 165
9.2.8 文本行高line-height … 166
9.3 綜合實例—CSS 字體樣式綜合演練  167
9.4 本章小結  170
第10 章　用CSS 設計圖片和背景 … 171
10.1 設置網頁的背景 … 171
10.1.1　背景顏色 … 171
10.1.2　背景圖片 … 173
10.2　設置背景圖片的樣式 … 174
10.2.1 背景圖片重復 … 174
10.2.2 背景圖片附件 … 176
10.2.3 背景圖片定位 … 177
10.3　設置網頁圖片的樣式 … 180
10.3.1　設置圖片邊框 … 180
10.3.2　圖文混合排版 … 183
10.4 綜合實例  184
10.4.1 實例1—為圖片添加邊框 … 184
10.4.2 實例2—光標移到圖片時產生漸變效果 … 185
10.5 本章小結  187
第11 章　用CSS 製作實用的菜單和網站導航 … 188
11.1 列表的使用 … 188
11.2 控制列表樣式  188
11.2.1 ul 無序列表  189
11.2.2 ol 有序列表  190
11.2.3 dl 定義列表  191
11.2.4 更改列表起始數值 … 192
11.3　橫排導航  193
11.3.1　文本導航 … 193
11.3.2　標簽式導航  195
11.4　豎排導航  197
11.5 綜合實例  199
11.5.1 實例１—實現背景變換的導航菜單 … 199
11.5.2 實例2—利用CSS 製作橫向導航 … 201
11.5.3 實例3—樹狀導航菜單 201
11.6 本章小結  204
第12 章　CSS 3 移動網頁開發… 205
12.1 預覽激動人心的CSS 3  205
12.2 邊框  209
12.2.1 圓角邊框 border-radius … 210
12.2.2 邊框圖片border-image … 211
12.2.3 邊框陰影box-shadow  212
12.3 背景  214
12.3.1 背景圖片尺寸background-size  214
12.3.2 背景圖片定位區域background-origin … 215
12.3.3 背景繪制區域background-clip  216
12.4 文本  217
12.4.1 文本陰影text-shadow  218
12.4.2 強制換行word-wrap  219
12.4.3 文本溢出text-overflow … 219
12.5 多列  221
12.5.1 創建多列column-count … 221
12.5.2 列的寬度column-width … 222
12.6 轉換  223
12.6.1 移動translate() … 223
12.6.2 旋轉rotate()  224
12.6.3 縮放scale()  225
12.7 綜合實例—將鼠標放上去移動並旋轉圖片 … 227
12.8 本章小結  228
第13 章　CSS 盒子模型與定位… 229
13.1 “盒子”與“模型”的概念探究 … 229
13.2　border … 230
13.2.1　邊框樣式：border-style … 231
13.2.2　屬性值的簡寫形式 … 233
13.2.3　邊框與背景  234
13.3　設置內邊距(padding) … 235
13.4　設置外邊距(margin)　  237
13.5　盒子的定位 … 240
13.5.1　靜態定位(static)  240
13.5.2　相對定位(relative) … 241
13.5.3　絕對定位(absolute) … 242
13.5.4　固定定位(fixed)  245
13.6 盒子的浮動 … 246
13.7　綜合案例—設置第1 個浮動的Div … 246
13.8 本章小結  248
第14 章　CSS+Div 佈局方法… 249
14.1 CSS 佈局模型 … 249
14.1.1 關於CSS 佈局 … 249
14.1.2 流動佈局模型 … 250
14.1.3 浮動佈局模型 … 252
14.1.4 層佈局模型  256
14.1.5 高度自適應  258
14.2　CSS 佈局理念  260
14.2.1　將頁面用Div 分塊 … 260
14.2.2　設計各塊的位置  260
14.2.3　用CSS 定位  261
14.3 常見的佈局類型 … 262
14.3.1 列固定寬度  262
14.3.2 列自適應 … 264
14.3.3 兩列固定寬度 … 266
14.3.4 兩列寬度自適應  267
14.3.5 兩列右列寬度自適應  268
14.3.6 三列浮動中間寬度自適應 269
14.3.7 三行二列居中高度自適應佈局 … 270
14.4 本章小結  272
第15 章　JavaScript 基礎知識 … 273
15.1 JavaScript 的添加方法  273
15.1.1 內部引用 … 273
15.1.2 外部調用js 文件  274
15.1.3 添加到事件中 … 275
15.2 基本數據類型  275
15.2.1 使用字符串型數據 … 275
15.2.2 使用數值型數據  276
15.2.3 使用布爾型數據  277
15.2.4 使用Undefined 和Null類型 … 277
15.3 常量和變量 … 278
15.3.1 常量 … 278
15.3.2 常量的使用方法  279
15.3.3 變量的定義  280
15.4 使用選擇語句  281
15.4.1 if 選擇語句  281
15.4.2 if…else 選擇語句 … 282
15.4.3 if…else if…else 選擇語句 283
15.4.4 switch 多條件選擇語句 … 285
15.5 使用循環語句  286
15.5.1 for 循環語句 … 286
15.5.2 while 循環語句  288
15.5.3 do-while 循環語句 … 289
15.5.4 break 和continue 跳轉語句 … 290
15.6 事件  291
15.6.1 事件詳解 … 292
15.6.2 事件與事件驅動  292
15.7　JavaScript 對象 … 294
15.7.1　聲明和實例化 … 295
15.7.2　對象的引用  296
15.7.3　navigator 對象 … 297
15.7.4　window 對象 … 298
15.7.5　location 對象 … 299
15.7.6　history 對象  301
15.7.7　document 對象 … 302
15.8　綜合實例—改變網頁背景顏色 303
15.9 本章小結  304
第16 章　設計製作企業網站 … 305
16.1 企業網站設計概述  305
16.1.1 企業網站主要功能 … 305
16.1.2 頁面配色 … 307
16.1.3 排版構架 … 308
16.2 各部分設計 … 309
16.2.1　頁面的通用規則  309
16.2.2 製作網站導航部分 … 310
16.2.3 製作header 右側部分  313
16.2.4 製作歡迎部分 … 322
16.3 本章小結  326