書本介紹
HTML5+CSS+JavaScript深入學習實錄(含DVD光碟1張)陳德春等編著
內容提要
HTML 語言是當今網頁設計的主流表現語言，CSS 是當今網頁設計的通用修飾技術，JavaScript 是當今網頁設計的最通用腳本表現技術。HTML+CSS+JavaScript 是當前主流的網頁設計組合，是每一名網頁設計師所必須具備並精通的技術。本書將上述三種技術巧妙地結合起來，詳細講解了這三種技術的基本知識和具體用法。本書共分為25 章，循序漸進、由淺入深地詳細講解了HTML+CSS+JavaScript技術的核心內容，並通過具體實例的實現過程演練了各個知識點的具體用法。首先，詳細講解了HTML標記語言的核心內容，主要包括頁面標記、文欄位落、超連結、使用圖片、插入列表、使用表格、插入框架、表單、HTML 5 等知識點的具體用法；然後，詳細講解了CSS 的核心內容，主要包括CSS 語法、頁面布局、容器、網頁元素修飾等知識點的具體用法；接下來，詳細講解了JavaScript 的核心內容，主要包括JavaScript基礎、行為操作等知識點的具體用法；最後通過一個個人部落格系統的實現過程，詳細講解了在網頁設計過程中聯合套用HTML+CSS+JavaScript 技術的過程。全書採用知識性、趣味性相結合的講解方式，穿插了學習技巧和職場生存法則，介紹了設計師所必須具備的基本素養，並且緊跟時代潮流，講解了HTML+CSS+JavaScript 技術在移動站點中的用法。
本書不但適合於網頁設計的初學者，對於有一定網頁設計經驗的讀者來說，本書也具有很大的參考價值。
書本目錄
第1章 設計的靈魂源於靈感 11.1成為一名出色的網頁設計師 1
1.2認識網頁和網站 2
1.2.1網頁 2
1.2.2網站 3
1.3製作網頁和網站的那些事 4
1.3.1網站製作流程 4
1.3.2網頁設計流程 5
1.3.3發布站點 5
1.4Web標準布局介紹 5
1.4.1看當前的Web開發標 6
1.4.2為什麼使用Web標準 6
1.4.3CSS布局標準 7
1.5網頁製作工具面面觀 8
1.5.1幾種可視化工具 8
1.5.2安裝Dreamweaver 10
1.6談HTML和JavaScript的必要性13
1.7靈感是設計師的設計之源 13
第2章 網頁設計三劍客 15
2.1三劍客之——體現身材的HTML 15
2.1.1HTML概述15
2.1.2HTML的特點 16
2.1.3看HTML的身材如何 16
2.2三劍客之——會化妝的CSS 16
2.2.1CSS概述 17
2.2.2CSS的特點17
2.2.3CSS的好處18
2.3三劍客之——JavaScript是美的升華18
2.3.1JavaScript概述 18
2.3.2JavaScript基本概念 18
2.3.3JavaScript的作用 19
2.4一個典型頁面檔案實例 20
第3章 網頁的記號 23
3.1為網頁設計髮型——設定網頁頭部元素 23
3.1.1設定文檔類型 23
3.1.2設定編碼類型 26
3.1.3設定頁面標題 28
3.2其他頭部元素 30
3.2.1命名空間 30
3.2.2meta標記 31
3.2.3關鍵字 31
3.2.4網頁描述 31
3.3設定頁面正文 34
3.4注釋是一種說明 36
第4章 你不一定了解的文字和段落 40
4.1標題文字 40
4.2文本文字 42
4.2.1文本文字標記<font>43
4.2.2字型設定 44
4.3段落標記 46
4.4換行標記 48
4.5插入水平線 48
4.6特殊符號處理 51
第5章 看超連結的跳躍 56
5.1連結概述 56
5.1.1錨鏈 56
5.1.2URL引用 57
5.2建立內部連結 57
5.3建立外部連結 60
5.4使用Telnet連結 63
5.5創建E-mail連結 64
5.6創建FTP連結 66
5.7其他形式的連結 68
5.7.1新聞組連結 69
5.7.2WAIS連結 69
第6章 圖片是修飾網頁的最佳途徑 71
6.1常用的圖片格式介紹 71
6.1.1GIF格式 71
6.1.2JPEG格式 72
6.2設定背景圖片 73
6.3插入圖片 75
6.3.1圖片的基本處理 76
6.3.2圖片布局處理 77
6.4設定圖片連結 80
第7章 你不一定了解的列表 82
7.1無序列表 82
7.2有序列表 84
7.3更加緊湊的選單列表 87
7.4定義列表標記 89
7.5列表的嵌套使用 91
第8章 表格沒那么簡單 94
8.1創建一個表格 94
8.2表格標題 97
8.3跨行和跨列 99
8.3.1實現跨列處理 100
8.3.2實現跨行處理 102
8.3.3實現同時跨行、跨列處理 105
8.4設定表格頁眉 107
8.5設定表格背景圖像 109
8.6對齊處理 110
8.6.1表格的整體對齊 110
8.6.2對齊表格中的內元素 112
8.7設定單元格大小 115
第9章 特效和多媒體帶來的絢麗 117
9.1實現滾動效果 117
9.2設定背景音樂 119
9.2.1代碼指定 119
9.2.2媒體外掛程式實現 120
9.3插入Flash 122
9.4插入Applet 126
9.5ActiveX 控制項129
第10章 使用框架 133
10.1框架標記介紹 133
10.2創建框架 135
10.3設定框架大小 139
10.4為框架創建連結142
10.5框架嵌套 146
第11章 看錶單帶來的革命性意義 152
11.1表單標記 152
11.2使用form標記 153
11.3使用文本域154
11.4使用文本區域 156
11.5使用按鈕 159
11.6使用單選按鈕和複選框 161
11.7使用列表選單 164
11.8使用檔案域167
11.9使用圖像域169
11.10 使用隱藏域171
11.11 使用單選組按鈕173
11.12 表單的綜合使用176
第12章 div布局處理188
12.1div標記介紹 188
12.1.1div的格式 188
12.1.2使用div 189
12.2插入div標記 190
12.3插入AP div 192
第13章 HTML 5來了196
13.1HTML 5 是下一代的HTML 196
13.1.1發展歷程196
13.1.2HTML 5的吸引力 197
13.2新特性之視頻處理 197
13.2.1video標記 198
13.2.2<video>標記的屬性198
13.3新特性之音頻處理 203
13.3.1audio標記 203
13.3.2<audio>標記的屬性204
13.4新特性之Canvas 208
13.4.1<canvas>標記介紹 208
13.4.2HTML DOM Canvas 對象 209
13.4.3Canvas實踐 209
13.5新特性之Web存儲 219
13.5.1Web存儲介紹219
13.5.2HTML 5中Web存儲的意義 220
13.5.3兩種存儲方法220
13.6新特性之表單新特性223
13.6.1全新的Input 類型 223
13.6.2全新的表單元素 227
13.6.3全新的表單屬性 229
第14章 等了很久的CSS基礎 236
14.1CSS語法 236
14.2使用選擇符239
14.2.1命名機制239
14.2.2通配選擇符 240
14.2.3類型選擇符 242
14.2.4群組選擇符 244
14.2.5包含選擇符 246
14.2.6ID選擇符248
14.2.7class選擇符 250
14.2.8組合選擇符 250
14.3CSS屬性介紹 250
14.4CSS編碼規範 252
14.4.1書寫規範253
14.4.2命名規範253
14.5顏色介紹 253
14.5.1顏色名稱定義254
14.5.2十六進制定義255
14.6長度單位 257
14.6.1絕對長度單位257
14.6.2相對長度單位257
14.7百分比值 258
14.8URL是地址261
14.8.1相對路徑261
14.8.2絕對路徑261
14.8.3套用實例261
14.9CSS的調用 264
第15章 先看頁面布局 268
15.1CSS元素介紹 268
15.1.1塊元素 268
15.1.2內聯元素271
15.1.3可變元素272
15.2CSS元素定位介紹 272
15.2.1元素的定位 272
15.2.2定位屬性277
15.3內容控制屬性 282
15.3.1控制頁面內容屬性display 282
15.3.2是否顯示屬性visibility 283
15.3.3居中顯示屬性text-align286
15.3.4邊界屬性margin 289
15.4控制頁面背景 291
15.4.1頁面背景概述291
15.4.2使用背景顏色292
15.4.3使用背景圖片293
15.4.4背景顏色和背景圖片混用 301
15.4.5設定文本樣式303
15.4.6設定連結樣式305
15.5使用浮動屬性 307
15.5.1浮動屬性簡介307
15.5.2固定元素相鄰307
15.5.3兩個浮動元素相鄰309
15.5.4多個浮動元素相鄰310
15.6清除浮動屬性 311
15.6.1清除浮動屬性簡介311
15.6.2使用清除浮動屬性313
15.7使用列表屬性 315
15.7.1列表樣式屬性list-style-type 315
15.7.2列表位置屬性list-style-position317
15.7.3列表圖片屬性list-style- image318
15.7.4列表綜合屬性list-style 320
第16章 將網頁打造成一個容器 322
16.1盒模型簡介322
16.1.1盒模型的內容322
16.1.2盒模型的背景324
16.2使用補白屬性 324
16.2.1補白屬性概述324
16.2.2使用補白屬性百分比值327
16.2.3使用單側補白屬性329
16.3使用框線屬性 331
16.3.1框線樣式屬性331
16.3.2框線寬度屬性333
16.3.3框線顏色屬性335
16.3.4框線屬性的綜合使用 336
16.3.5使用表格框線屬性338
16.4使用邊界屬性 340
16.4.1邊界屬性340
16.4.2單側邊界屬性342
16.4.3相鄰邊界屬性344
16.5父子元素之間的距離349
16.5.1子元素邊界為0 349
16.5.2父元素補白為0 351
16.6嵌套元素使用負邊界353
16.7固定元素的大小355
第17章 CSS設定和修飾 358
17.1CSS文本設定 358
17.1.1文本縮進358
17.1.2對齊文本362
17.1.3圖文混排對齊處理365
17.1.4設定行高和間隔 367
17.1.5設定文本間隔和空白 372
17.1.6實現文本轉換375
17.1.7實現水平和垂直居中 376
17.2文本修飾連結 380
17.2.1文本修飾380
17.2.2使用連結屬性383
17.2.3設定滑鼠懸停樣式389
17.3CSS修飾圖片 391
17.3.1背景圖片修飾391
17.3.2修飾內容圖片392
17.4CSS表單修飾 395
17.4.1修飾表單文本域 396
17.4.2修飾表單文本區域396
17.4.3修飾表單按鈕398
17.4.4修飾表單複選框 399
17.4.5修飾表單單選按鈕400
17.4.6修飾表單列表401
17.4.7修飾表單檔案域 402
17.4.8修飾表單圖像域 403
17.5修飾頁面滾動條404
17.6修飾水平線406
17.7修飾表格 407
17.7.1修飾表格邊線和背景 407
17.7.2設定表格的寬度和高度408
17.7.3實現表格居中409
17.7.4設定表格內容高度412
第18章 引入JavaScript 414
18.1JavaScript簡介 414
18.1.1JavaScript格式414
18.1.2一個典型的JavaScript檔案 414
18.2數據類型 416
18.2.1數據類型概述416
18.2.2JavaScript常量417
18.2.3JavaScript變數417
18.3表達式和運算符420
18.3.1JavaScript表達式 420
18.3.2JavaScript運算符 420
18.4JavaScript循環語句 424
18.4.1if條件語句 424
18.4.2for循環語句 427
18.4.3while循環語句 429
18.4.4do…while循環語句 430
18.4.5break控制 432
18.4.6switch循環語句 432
18.5JavaScript函式 432
18.5.1函式的構成 433
18.5.2JavaScript常用函式434
18.6JavaScript對象 436
18.6.1對象基礎知識436
18.6.2JavaScript常用對象和方法 438
18.7JavaScript事件 441
18.7.1JavaScript常用事件441
18.7.2事件處理程式443
18.8JavaScript視窗對象 444
18.8.1視窗對象444
18.8.2視窗對象的事件驅動 444
18.8.3視窗對象中的屬性444
18.8.4視窗對象的方法 445
18.8.5JavaScript視窗對象的套用 445
18.9JavaScript框架對象 448
第19章 行為操作 451
19.1行為介紹 451
19.1.1行為簡介451
19.1.2行為事件453
19.1.3行為的使用 453
19.2調用JavaScript 455
19.3URL轉移 456
19.4交換圖像 458
19.5打開瀏覽器視窗460
19.6顯示隱藏元素 462
19.7播放聲音 463
19.8改變屬性 465
19.9彈出信息 467
19.10 跳轉選單 469
19.11 拖動AP元素 472
第20章 談一談設計師這個行業 474
20.1網頁設計師這一行業474
20.2從合格到優秀其實並不遙遠 475
20.3企業需要什麼樣的人才 476
20.4設計師們的三塊大蛋糕 476
20.5從設計師的擔心談出路 477
第21章 從面試中談設計 479
21.1面試 479
21.1.1面試前的準備479
21.1.2常見的面試錯誤 480
21.2面試中最大的問題 481
21.2.1網頁設計師要抓住設計的靈魂 481
21.2.2需要牢記的原則 481
21.2.3考官的問題——網頁設計理念 484
21.2.4考官的問題——網頁設計的誤區484
21.3在面試中所得——什麼才是好的網頁設計 484
21.4配色的問題485
21.5不得不說的標題486
21.6面試問題——網頁設計布局 487
21.7網頁設計必須注意的26個問題 488
21.8探索無止境，學習無歸期491
第22章 從項目中談模組 493
22.1一個項目引發的問題493
22.2JavaScript特效的套用 495
22.3文字處理 496
22.3.1實例概述496
22.3.2定義文本顏色497
22.3.3指定文本內容498
22.3.4文本增亮處理498
22.3.5文本減亮處理498
22.3.6定義變換頻率499
22.4時間處理 502
22.5圖像處理 506
22.5.1實例概述507
22.5.2設定圖像屬性507
22.5.3亮度增加處理507
22.5.4亮度減小處理508
22.6背景處理 511
22.7滑鼠游標處理 515
22.7.1實例概述515
22.7.2指定跟隨文本515
22.7.3文本效果處理515
22.7.4頁面顯示516
22.8選單處理 518
22.8.1實例概述518
22.8.2設定選單元素內容518
22.8.3設定滾動區域屬性519
第23章 為Android手機設計網頁 523
23.1搭建開發環境 523
23.1.1搭建Android開發環境 523
23.1.2搭建網頁運行環境525
23.2先看一段代碼 528
23.2.1實現主頁528
23.2.2編寫CSS檔案 529
23.2.3實現頁面自動縮放531
23.3添加Android的CSS 532
23.3.1編寫基本的樣式 532
23.3.2添加視覺效果534
23.4添加JavaScript 535
23.4.1jQuery框架介紹 535
23.4.2具體實踐536
23.5使用Ajax 539
23.5.1編寫HTML檔案 539
23.5.2編寫JavaScript檔案 543
23.5.3最後的修飾 544
23.6讓網頁動起來 545
23.6.1一個開源框架——JQTouch 546
23.6.2一個簡單套用546
第24章 SEO最佳化 555
24.1SEO基礎 555
24.2搜尋引擎 556
24.2.1搜尋引擎的工作 556
24.2.2搜尋引擎之間的差異 557
24.3非常重要的關鍵字 557
24.3.1最佳化正確的關鍵字557
24.3.2關鍵字密度 558
24.3.3特殊的關鍵字559
24.3.4利用相關性提高網站關鍵字排名560
24.3.5挖掘準確的長尾關鍵字562
24.4連結 563
24.4.1內向連結和外向連結 563
24.4.2錨文本 564
24.5做好數據分析 565
24.6網站排名算法總結 566
24.7幾個有效的SEO排名策略567
第25章 個人部落格網站 569
25.1網站規劃 569
25.1.1站點需求分析569
25.1.2預期效果分析570
25.1.3站點結構規劃571
25.2切圖分析 571
25.3製作站點首頁 572
25.3.1實現流程分析572
25.3.2製作頂部導航573
25.3.3設計中間內容部分577
25.3.4製作底部著作權部分583
25.4製作日誌頁面 585
25.4.1實現流程分析585
25.4.2日誌內容實現585
25.5製作日誌詳情頁面 586
25.5.1實現流程分析586
25.5.2頁面具體實現587
媒體評論
作者陸川是IBM的一位高級資料庫專家，從事資料庫技術工作多年，對資料庫技術和業界主流的資料庫產品及與資料庫相關產品都有豐富的經驗，尤其擅長informix資料庫的開發、移植、部署和複雜的資料庫問題解決，參與了國內許很大客戶的informix大型項目開發與實施，在客戶和同事眼裡是受尊敬的informix高手。本書是作者在工作之餘積累平時的工作與經驗寫作而成的，是作者非常寶貴的實際經驗的總結與分享，所以我特別向大家推薦本書。劉勝利
IBM大中華區數據管理類產品
Tivoli系統管理類產品技術總監
前言
自從網際網路技術誕生以來，便孕育出了海量級數量的Web站點，網頁設計師便成了很熱門的工作職位，“高薪、熱門、有前景”是權威部門對網頁設計師這一行業的客觀評價。這是一本講解HTML、CSS、JavaScript核心內容和具體用法的書，可作為網頁製作初學者的入門教程，同時也可為網站建設的專業人士提供一些參考。本書以“講清語法、學以致用”為指導思想，不僅僅將筆墨局限於語法講解上，而且還通過一個個鮮活、典型的小實例來達到學以致用的目的。從本書的目錄可見一斑，每個語法都有相應的實例，實例教學始終是本書的核心思想。為了方便廣大讀者學習，本人花費了半年時間寫作這本書。本書全面地介紹了網站製作的基礎技術，並以對應的實例介紹了各種技術的實現方法。本書力求讓讀者迅速掌握網頁設計技術的根本，使讀者能夠建設出基本的Web站點。本書特色
本書內容相當豐富，實例內容覆蓋全面。我們的目標是通過一本圖書，提供多本圖書的價值，讀者可以根據自己的需要有選擇地閱讀。在內容的編寫上，本書具有以下特色。結構合理
從讀者的實際需要出發，科學安排知識結構，內容由淺入深，敘述清楚，具有很強的知識性和實用性，幾乎講解了HTML+CSS+JavaScript所有的知識點。全書精心篩選的最具代表性、讀者最關心的典型知識點，幾乎包括網頁設計的各個方面。易學易懂
本書條理清晰、語言簡潔，可幫助讀者快速掌握每個知識點；每個部分既相互連貫又自成體系，使讀者既可以按照本書編排的章節順序進行學習，也可以根據自己的需求對某一章節進行有針對性的學習。實用性強
本書徹底摒棄枯燥的理論和簡單的操作，注重實用性和可操作性，詳細講解了各個部分的源碼知識，使讀者掌握相關操作技能的同時，還能學習到相應的基礎知識。舉一反三
書中的每一個實例都專門配備了“舉一反三”模組，針對本實例實現了進一步的拓展，使整個內容深度上了一個台階，使讀者了解了與之有關的知識，讓讀者不知不覺地邁入了高手殿堂。案例精講，深入剖析
為使讀者步入網頁製作的高手之林，在本書的最後詳細介紹了一個典型實戰實例的實現過程，使讀者不但對前面的內容進行了系統的複習，而且能夠從實戰中輕鬆掌握各個知識點的綜合運用技巧，為讀者將來更深層次的學習打下堅實的基礎。實例剖析，Dreamweaver操作
為使讀者真正掌握具體的網頁製作知識，本書通過對應的實例對各個知識點的使用進行了詳細剖析。在實例的具體講解過程中，完全實現了Dreamweaver操作的處理方法。這樣使讀者不但掌握了網頁製作技術的精髓，而且學會了Dreamweaver工具的使用方法，做到了一舉兩得。附帶教學資源豐富
本書贈送了豐富的教學資源，既有長時間的實例講解視頻，也有實用的知識點講解視頻，還有豐富的電子書資源；既有國內外經典網站模板，也有贈送的綜合大型網站實例。這些附帶資源，可以使讀者的學習過程更加便捷。附帶光碟說明
（1）daima保存了本書中所有實例的源碼和“舉一反三”的源碼。
（2）PPT
為讀者和教研人員設計了精美的PPT檔案，供學習和教學使用。
（3）源碼講解視頻
保存了本書中所有實例的講解視頻，講解詳細，便於讀者理解學習並掌握。
（4）知識點講解視頻
保存了針對本書知識點的講解視頻，講解細緻而深入，便於讀者課餘時間學習並掌握相關知識點。
（5）豐富的電子書學習資料
保存了筆者精心挑選的學習資料，包括HTML、CSS和JavaScript、HTML、網頁設計、Dreamweaver等學習資料。這些贈送的資料以免費電子書的形式體驗，可以直接複製到自己的智慧型手機設備中，這樣便可以在業餘時間閱讀學習。
（6）贈送的綜合實例
免費贈送了5個大型綜合實例，幫助讀者深入本書內容，學習在大型項目中如何運用本書的知識。
讀者對象
初學網頁設計的自學者大中專院校的老師和學生
從事Web開發的程式設計師 編程愛好者
網頁設計愛好者 相關培訓機構的老師和學員
網頁設計師
作者致謝
參與本書編寫工作的有陳德春、管西京、李冬艷、代林峰、黃河、曹臻、白樺、伍傑、劉英田、劉繼虎、王玉芹、程星、朱萬林、楊陽、徐亮等。在編寫本書過程中，得到了電子工業出版社工作人員的大力支持，正是各位編輯的求實、耐心和效率才能使本書快速出版。另外也十分感謝我的家人，在我寫作的時候給予了我巨大的支持。但是畢竟水平有限，紕漏和不盡人意之處在所難免，誠請讀者提出意見或建議，以便修訂並使之更加完善。編者
2013年6月
