《基於Web標準的網頁設計與製作》(第2版)全面介紹了基於Web標準的網頁設計與製作技術,採用“原理+實例+綜合案例”的編排方式,所有實例都根據所涉及的原理編排在相關的原理之後,使讀者能迅速理解有關原理的用途。《基於Web標準的網頁設計與製作》分為7章,內容包括網頁與網站的相關知識、HTML語言和XHTML標準、CSS網頁樣式和布局設計、Fireworks美工設計、網站開發和網頁設計的過程與案例,以及JavaScript和jQuery前台腳本編程技術。
《基於Web標準的網頁設計與製作》(第2版)已於2015年7月上市,該版本增加了HTML5等新內容,對JavaScript部分進行了重寫,對章節順序進行了調整,使內容編排更為合理。
基本介紹
版權資訊
內容簡介
編輯推薦
前 言
目 錄
1.1 初識網頁設計 10
1.1.1 什麼是網頁 10
1.1.2 網頁設計的兩個基本問題 11
1.1.3 網頁設計語言——HTML簡介 12
1.1.4網頁製作軟體 13
1.2 網站的建立 13
1.2.1 網站的特徵 14
1.2.2 在Dreamweaver中建立站點 14
1.3 Web伺服器與瀏覽器 16
1.3.1 Web伺服器的作用 17
1.3.2瀏覽器的種類和作用 17
1.4 靜態網頁和動態網頁 18
1.5 URL的含義和結構 20
1.6 域名與主機的關係 21
習 題 1 22
第2章HTML 22
2.1 HTML概述 22
2.1.1 HTML文檔的結構 23
2.1.2 Dreamweaver的開發界面 24
2.1.3使用DW新建HTML檔案 24
2.1.4 HTML標記 25
2.1.5 常見的HTML標記及屬性 26
2.2在網頁中添加文本 26
2.2.1 文本格式標記 27
2.2.2文本的換行和空格 28
2.2.3 文本中的字元實體 29
2.2.4字型標記 30
2.2.5創建列表 31
2.3 利用DW代碼視圖提高效率 32
2.3.1 代碼提示 32
2.3.2 拆分視圖和代碼快速定位 33
2.3.3 DW中的常用快捷鍵 34
2.4 插入圖像 34
2.4.1 img>標記 35
2.4.2 網頁中支持的圖像格式 35
2.5 創建超連結 37
2.5.1 超連結標記a> 37
2.5.2 絕對URL與相對URL 38
2.5.3 超連結的種類(href屬性的取值) 40
2.5.4 超連結目標的打開方式 40
2.5.5 超連結製作的原則 41
2.5.6 DW中超連結屬性面板的使用 41
2.6插入flash及多媒體元素 42
2.6.1 插入flash的方法 42
2.6.2 插入視頻或音頻檔案 43
2.6.3 HTML 5新增的多媒體標記 44
2.7 創建表格 46
2.7.1 表格標記(table>) 46
2.7.2 行tr>和單元格標記(td>、th>) 48
2.7.3 在DW中操作表格的方法 51
2.7.4製作固定寬度的表格 52
2.7.5 特殊效果表格的製作 53
2.7.6 用普通表格與布局表格進行網頁布局 55
2.7.7 表格布局綜合案例——製作太陽能網站 57
2.8 創建表單 59
2.8.1form>標記及其屬性 59
2.8.2 input/>標記 61
2.8.3 select>和option>標記 63
2.8.4 多行文本域標記textarea> 64
2.8.5 表單數據的傳遞過程 64
2.8.6表單中的按鈕 66
2.8.7 表單的輔助標記 66
2.8.8 HTML5新增的表單標記和屬性 66
2.9 框架標記* 69
2.9.1 框架的作用 70
2.9.2 frameset>標記 70
2.9.3 frame />標記 71
2.9.4嵌入式框架標記iframe> 72
2.10 頭部標記* 73
習題 74
第3章XHTML與Web標準 75
3.1 XHTML與HTML的區別 75
3.1.1 文檔類型的含義和選擇 75
3.1.2 XHTML與HTML的重要區別 76
3.2 Web標準 77
3.2.1 傳統HTML的缺點 77
3.2.2 Web標準的含義 78
3.2.3 Web標準的優勢 80
3.3 HTML元素的概念 80
3.3.1 行內元素和塊級元素 81
3.3.2 div和span標記 82
3.4 HTML5簡介* 82
3.4.1 HTML5新增的標記 83
3.4.2 HTML5語法的改進 84
習題 85
第4章 CSS 86
4.1 CSS基礎 86
4.1.1 CSS的語法 86
4.1.2 在HTML中引入CSS的方法 87
4.1.3 選擇器的分類 88
4.1.4 CSS文本修飾 91
4.1.5 偽類選擇器及其套用 92
4.2 CSS的特性 93
4.2.1 CSS的層疊性 93
4.2.2 CSS的繼承性 95
4.2.3 選擇器的組合 97
4.2.4 CSS 2.1新增選擇器簡介 102
4.3 CSS設計和書寫技巧* 106
4.3.1 CSS樣式總體設計原則 106
4.3.2 DW對CSS的可視化編輯支持 107
4.3.3 CSS屬性的值和單位 109
4.3.4 瀏覽器的私有CSS屬性 110
4.4盒子模型及標準流下的定位 111
4.4.1 盒子模型基礎 111
4.4.2 盒子模型的套用 115
4.4.3 盒子在標準流下的定位原則 117
4.5 背景的控制 121
4.5.1 CSS的背景屬性 122
4.5.2背景的基本運用技術 123
4.5.3 滑動門技術-背景的高級運用 126
4.5.4 背景圖案的翻轉-控制背景的顯示區域 130
4.5.5 CSS圓角設計 131
4.6 盒子的浮動 135
4.6.1 盒子浮動後的特點 135
4.6.2 浮動的清除 137
4.6.3 浮動的瀏覽器解釋問題 138
4.6.4 浮動的套用舉例 142
4.7 相對定位和絕對定位 147
4.7.1 定位屬性和偏移屬性 147
4.7.2 相對定位 148
4.7.3 相對定位的套用舉例 148
4.7.4 絕對定位 150
4.7.5 絕對定位的套用舉例 152
4.7.6 DW中定位屬性面板介紹 161
4.7.7 與position屬性有關的CSS屬性 162
4.8 CSS+div布局 166
4.8.1 分欄布局的種類 167
4.8.2 固定寬度布局 168
4.8.3 CSS布局的案例——重構太陽能網站 168
4.8.4 可變寬度布局 172
4.8.5 HTML5 新增的文檔結構標記 176
4.8.6 CSS 3新增功能和屬性一瞥* 177
4.9 CSS瀏覽器的兼容問題* 178
習 題 180
第5章 Fireworks 182
5.1 Fireworks基礎 182
5.1.1 矢量圖和點陣圖的概念 182
5.1.2 認識Fireworks的界面 183
5.1.3 新建、打開和導入檔案 184
5.1.4畫布和圖像的調整 185
5.2 操作對象 188
5.2.1選擇、移動和對齊對象 189
5.2.2 變形和扭曲 189
5.2.3 改變對象的疊放次序 191
5.2.4 設定對象的不透明度 191
5.2.5 操作對象的快捷鍵 192
5.3 編輯點陣圖 192
5.3.1 創建和取消選區 192
5.3.2 複製和移動選區中的內容 196
5.3.3 編輯選區中的像素區域 197
5.4 繪製矢量圖形 199
5.4.1 創建矢量圖形 199
5.4.2 填充和筆觸屬性 200
5.4.3 自由形狀工具 203
5.4.4 調整矢量線條 205
5.4.5 路徑的切割和組合 206
5.4.6 路徑和選區的相互轉換 208
5.5 文本對象的使用 210
5.5.1 文本編輯和修飾的過程舉例 210
5.5.2 特殊文字效果製作舉例 212
5.5.3 將文本附加到路徑 213
5.6 蒙版 214
5.6.1 使用“貼上於內部”創建矢量蒙版 214
5.6.2 創建圖層蒙版 220
5.7 簡單GIF動畫的製作* 223
5.7.1 使用補間實例製作動畫 223
5.7.2 製作遮罩動畫 224
5.8 切片及導出 225
5.8.1 切片的作用 226
5.8.2 切片的基本操作 226
5.8.3 切片的實例 228
習 題 231
第6章 網站開發和網頁設計過程 233
6.1網站開發的過程 233
6.1.1 基本任務和角色 233
6.1.2 網站開發過程的各環節 234
6.2 遵循Web標準的網頁設計步驟 237
6.2.1網頁設計步驟概述 237
6.2.2 內容分析 239
6.2.3 HTML結構設計 240
6.2.4 原型設計 243
6.2.5 網頁效果圖設計 245
6.2.6 布局設計 247
6.2.7 視覺設計 252
6.2.8 互動效果設計 260
6.2.9 CSS布局的優點 262
6.3 網站的風格設計 262
6.3.1 網站風格設計的基本原則 263
6.3.2 網頁色彩的搭配 263
6.3.3 網頁版式設計 271
6.4 網站的欄目規劃和目錄結構設計 274
6.4.1 網站的欄目規劃 274
6.4.2 網站的目錄結構設計 275
6.5 網站的導航設計* 276
6.5.1 導航的實現方法 277
6.5.2 導航的設計策略 278
6.6 網站的環境準備* 278
6.6.1 架設網站的基本條件 278
6.6.2 購買主機空間和域名 279
6.6.3 配置主機空間和域名 279
6.6.4 上傳網站 280
習 題 6 281
第7章 JavaScript 282
7.1 JavaScript簡介 282
7.1.1 JavaScript的特點 282
7.1.2 JavaScript的用途 282
7.1.3 JavaScript的代碼結構 283
7.1.4 事件監聽程式 285
7.1.5 開發和調試JavaScript的工具 286
7.2 JavaScript語言基礎 287
7.2.1 JavaScript的變數 287
7.2.2 JavaScript的運算符 288
7.2.3 JavaScript數據類型 290
7.2.4 數組(array) 292
7.2.5 JavaScript語句 294
7.2.6 函式 298
7.3 對象 299
7.3.1 JavaScript對象 299
7.3.2 with語句 301
7.3.3 this關鍵字 301
7.3.4 JavaScript的內置對象 302
7.4 瀏覽器對象模型BOM 303
7.4.1 window對象 303
7.4.2定時操作函式 305
7.4.3 location對象 308
7.4.4 history對象 309
7.4.5 document對象 309
7.4.6 screen對象 311
7.5 文檔對象模型DOM 312
7.5.1 網頁中的DOM模型 312
7.5.2 DOM編程引例 313
7.5.3 訪問指定節點 316
7.5.4 訪問和設定元素的HTML屬性 319
7.5.5 訪問和設定元素的內容 321
7.5.6 訪問和設定元素的CSS屬性 321
7.5.7 創建和替換元素節點 324
7.5.8 用DOM控制表單 325
7.6 事件處理 327
7.6.1 事件流 327
7.6.2 處理事件的兩種方法 328
7.6.3 瀏覽器中的常用事件 330
7.6.4 事件對象 333
7.6.5 DOM和事件編程實例 335
7.7 JavaScript外掛程式套用舉例 340
7.7.1 使用Highslide製作lightbox效果 340
7.7.2 使用pxiviewer製作圖片輪顯效果 342
7.8 jQuery框架使用入門* 343
7.8.1 jQuery框架的功能 343
7.8.2下載並使用jQuery 344
7.8.3 jQuery中的“$” 345
7.8.4 jQuery對象與DOM對象 348
7.8.5 jQuery的選擇器 349
7.8.6 jQuery中的常用方法 352
7.8.7 jQuery的套用舉例 353
7.8.8 jQuery的外掛程式套用舉例* 360
習 題 362
參考文獻 364