HTML5+CSS3跨平臺網頁設計實例教程

單元1站點與網頁的創(chuàng)建1
【知識必備】1
【引導訓練】4
任務11創(chuàng)建“單元1”站點并瀏覽網頁4
任務111創(chuàng)建本地站點“單元1”4
任務112認識Dreamweaver CC的工作界面6
任務113打開與瀏覽網頁文檔0101.html10
任務12認知HTML5的典型標記和結構標簽13
任務121分析HTML代碼的組成結構13
任務122認知HTML5中典型的標記方法17
任務123認知HTML5主要的結構標簽17
【同步訓練】18
任務13打開并瀏覽網頁0103.html18
【技術進階】19
【問題探究】20
【單元習題】21
單元2網頁中文本與段落的應用設計22
【知識必備】22
【引導訓練】37
任務21制作阿壩概況的文本網頁37
任務211建立站點及其目錄結構38
任務212創(chuàng)建與保存網頁文檔0201.html40
任務213設置網頁的首選項40
任務214設置頁面的整體屬性42
任務215在網頁中輸入文字48
任務216輸入與編輯網頁中的文本49
任務217格式化網頁文本50
任務218設置超鏈接與瀏覽網頁效果51
任務219在【代碼】視圖中查看CSS代碼和HTML代碼51
任務22使用CSS美化文本標題和文本段落55
【同步訓練】61
任務23制作介紹九寨溝概況的文本網頁61
【技術進階】62
【問題探究】65
【單元習題】67
目錄單元3網頁中圖像與背景的應用設計68
【知識必備】68
【引導訓練】74
任務31制作介紹九寨溝景區(qū)景點的圖文混排網頁74
任務311使用【管理站點】對話框創(chuàng)建站點“單元3”75
任務312應用【文件】面板新建網頁0301.html76
任務313設置頁面的背景圖像77
任務314在網頁中輸入所需的文本內容與設置文本格式78
任務315插入圖像與設置圖像屬性79
任務316在“代碼”視圖中查看CSS代碼和HTML代碼81
任務32使用CSS美化網頁文本與圖片82
任務33創(chuàng)建多張圖片并行排列的網頁0303.html88
【同步訓練】90
任務34在網頁中設置圖片與背景屬性90
任務35創(chuàng)建圖文混排的網頁0305.html91
【技術進階】91
【問題探究】96
【單元習題】98
單元4網頁中列表與表格的應用設計99
【知識必備】99
【引導訓練】105
任務41創(chuàng)建以項目列表形式表現(xiàn)新聞標題的網頁105
任務42創(chuàng)建以項目列表形式表現(xiàn)圖文按鈕的網頁109
任務43創(chuàng)建應用表格存放數據的網頁114
任務44創(chuàng)建包含個性化表格的網頁119
【同步訓練】122
任務45創(chuàng)建項目列表為主的旅游攻略標題網頁122
任務46創(chuàng)建包含5行3列表格的網頁123
【技術進階】123
【問題探究】124
【單元習題】127
單元5網頁中超鏈接與導航欄的應用設計128
【知識必備】128
【引導訓練】131
任務51設置網頁中導航欄的超鏈接屬性131
任務52制作包含橫向主導航欄的網頁134
任務53制作包含縱向欄目導航欄的網頁139
任務54創(chuàng)建包含圖像熱點鏈接的網頁141
【同步訓練】145
任務55創(chuàng)建包含頂部橫向導航欄的網頁145
任務56創(chuàng)建包含多種不同形狀圖像鏈接的網頁146
【技術進階】146
【問題探究】150
【單元習題】151
單元6網頁中表單與控件的應用設計152
【知識必備】152
【引導訓練】158
任務61在網頁中添加表單及表單控件158
任務62創(chuàng)建用戶注冊的表單網頁164
【同步訓練】171
任務63創(chuàng)建用戶登錄的表單網頁171
任務64創(chuàng)建用戶留言反饋網頁172
【技術進階】172
【問題探究】174
【單元習題】174
單元7網頁中音頻與視頻的應用設計175
【知識必備】175
【引導訓練】177
任務71設計基于HTML5的網頁音樂播放器之一177
任務72設計基于HTML5的網頁視頻播放器之一179
【同步訓練】180
任務73設計基于HTML5的網頁音樂播放器之二180
任務74設計基于HTML5的網頁視頻播放器之二181
【技術進階】182
【問題探究】183
【單元習題】184
單元8網頁中圖形繪制與操作的應用設計185
【知識必備】185
【引導訓練】194
任務81網頁中應用純CSS繪制各種規(guī)則圖形194
任務82網頁中應用純CSS繪制各種特色圖形197
任務83網頁中應用canvas元素繪制各種圖形和文字200
任務84網頁中繪制菊花圖形206
【同步訓練】208
任務85網頁中繪制陰陽圖和五角星208
任務86網頁中繪制多種圖形和圖片208
【技術進階】209
【問題探究】210
【單元習題】213
單元9網頁中特效與交互的應用設計214
【知識必備】214
【引導訓練】227
任務91網頁中顯示當前日期227
任務92網頁中不同時間段顯示不同的問候語231
任務93網頁中制作圓角按鈕和圓角圖片234
任務94設計網頁中的圓形導航按鈕239
任務95網頁中實現(xiàn)搜索框聚焦變長的效果242
任務96網頁中應用CSS實現(xiàn)超酷導航菜單243
任務97網頁中實現(xiàn)仿Office風格的多級菜單246
任務98網頁中實現(xiàn)圖片拖動操作251
【同步訓練】254
任務99網頁中不同的節(jié)假日顯示不同的問候語254
任務910網頁中創(chuàng)建下拉導航菜單255
【技術進階】255
【問題探究】255
【單元習題】261
單元10網頁中元素與整體布局的應用設計262
【知識必備】262
【引導訓練】276
任務101體驗網頁的不同布局方式276
任務102創(chuàng)建浮動定位2列式布局的網頁281
任務103創(chuàng)建等距排列的4列式布局網頁289
任務104創(chuàng)建不規(guī)則布局網頁295
【同步訓練】300
任務105創(chuàng)建浮動定位2列規(guī)則分塊的網頁300
任務106創(chuàng)建3列式與4列式等距布局的網頁301
【技術進階】301
【問題探究】302
【單元習題】304
參考文獻305
附錄ACSS的屬性306
附錄BCSS的選擇器307