網頁設計與製作案例教程(HTML5+CSS3)(第2版)

《網頁設計與製作案例教程(HTML5+CSS3)(第2版)》是2023年電子工業出版社出版的圖書,作者是徐洪亮、陳曉靖、常寬。

基本介紹

  • 中文名:網頁設計與製作案例教程(HTML5+CSS3)(第2版)
  • 作者:徐洪亮、陳曉靖、常寬
  • 出版社:電子工業出版社
  • 出版時間:2023年1月
  • 頁數:408 頁
  • 定價:58.00 元
  • 開本:16 開
  • ISBN:9787121440007
內容簡介,圖書目錄,

內容簡介

本書共14章,分為基礎篇、技能篇、布局篇和套用篇。基礎篇主要內容包括網頁基礎、HTML語言基礎、CSS樣式基礎。技能篇主要介紹了使用CSS設定文字樣式、圖像樣式、列表樣式、表格樣式及表單樣式。布局篇詳細講解了網頁的三種基本布局方法:流布局、浮動布局和定位布局。最套用篇給出了兩個具有很強實用性的綜合網站案例。本書注重理論與實踐相結合,將企業實際工作規範融入到案例中,避免書本知識與實際套用脫節,實現學習與工作的緊密銜接。

圖書目錄

基 礎 篇
第1章 網頁基礎 / 1
1.1 基礎項目1:製作“念奴嬌·赤壁懷古”網頁 / 1
1.2 知識庫:網頁基礎知識 / 5
1.2.1 網站開發流程 / 5
1.2.2 網頁常用術語 / 8
1.2.3 網頁檔案命名規範 / 10
1.3 基礎項目2:製作“蘇軾介紹”網頁 / 11
1.4 知識庫:Dreamweaver 2021的工作界面和使用技巧 / 14
1.4.1 啟動Dreamweaver 2021 / 14
1.4.2 認識Dreamweaver 2021工作界面 / 17
1.4.3 更改Dreamweaver 2021默認界面和布局 / 21
1.4.4 使用Dreamweaver 2021的幾個小技巧 / 22
1.5 提高項目:製作“青春頌歌”網頁 / 23
1.6 拓展項目:製作“速度滑冰”網頁 / 24
知識檢測1 / 24
第2章 HTML語言基礎 / 26
2.1 基礎項目1:製作“走向遠方”網頁 / 26
2.2 知識庫:HTML語言的概念和基本結構 / 27
2.2.1 HTML語言的概念 / 27
2.2.2 HTML文檔的基本結構 / 28
2.3 基礎項目2:製作“我的空間”網頁 / 30
2.4 知識庫:HTML標籤的分類及常見的HTML標籤 / 32
2.4.1 HTML標籤的分類 / 32
2.4.2 常見的HTML標籤 / 34
2.5 提高項目:製作“垃圾分類 人人有責”網頁 / 43
2.6 拓展項目:製作“菜鳥加油”網頁 / 44
知識檢測2 / 44
第3章 CSS樣式基礎 / 45
3.1 基礎項目1:製作“古詩詞欣賞”網頁 / 45
3.2 知識庫:CSS語言的概念和基本結構 / 50
3.2.1 CSS語言的概念 / 50
3.2.2 CSS語言的基本結構和注釋 / 50
3.2.3 CSS書寫順序及規範 / 51
3.3 基礎項目2:製作“服務奧運,精彩人生”網頁 / 54
3.4 知識庫:CSS樣式表的引入及選擇器的使用 / 58
3.4.1 CSS樣式表的引入 / 58
3.4.2 CSS選擇器的使用 / 61
3.5 提高項目:製作“女排精神”網頁 / 68
3.6 拓展項目:製作“琴棋書畫”網頁 / 69
知識檢測3 / 70
技 能 篇
第4章 使用CSS設定文字樣式 / 71
4.1 基礎項目1:製作“古人書房佳聯賞析”網頁 / 71
4.2 知識庫:CSS文字樣式 / 75
4.2.1 文字樣式常用屬性 / 75
4.2.2 網頁安全色 / 80
4.2.3 CSS網頁元素的長度單位 / 80
4.3 基礎項目2:製作“中國名花”網頁 / 82
4.4 知識庫:CSS段落樣式與元素特性 / 87
4.4.1 段落樣式常用屬性 / 87
4.4.2 關於<span>標籤 / 92
4.4.3 清除行內塊元素默認空白間隙技巧 / 92
4.5 提高項目:製作“詩詞鑑賞”網頁 / 94
4.6 拓展項目:製作“古典園林”網頁 / 96
知識檢測4 / 97
第5章 使用CSS設定圖像樣式 / 98
5.1 基礎項目1:製作“茶文化”網頁 / 98
5.2 知識庫:CSS圖像樣式 / 102
5.2.1 網頁圖像格式 / 102
5.2.2 常用CSS圖像樣式 / 103
5.2.3 圖像映射 / 107
5.3 基礎項目2:製作“少年中國說”網頁 / 109
5.4 知識庫:CSS背景樣式 / 113
5.4.1 背景顏色樣式 / 113
5.4.2 背景圖像樣式 / 114
5.4.3 CSS雪碧圖 / 116
5.5 提高項目:製作“低碳生活 從我做起”網頁 / 119
5.6 拓展項目:製作“春節民俗”網頁 / 120
知識檢測5 / 121
第6章 使用CSS設定列表樣式 / 122
6.1 基礎項目1:製作“特色北京”橫嚮導航欄 / 122
6.2 基礎項目2:製作“特色北京”縱嚮導航欄 / 125
6.3 基礎項目3:製作“八大菜系”下拉選單式導航欄 / 127
6.4 基礎項目4:製作“青少年文明公約”網頁 / 132
6.5 基礎項目5:製作“2020年感動中國十大人物”網頁 / 136
6.6 知識庫:CSS常用列表樣式 / 141
6.6.1 HTML列表 / 141
6.6.2 常用CSS列表樣式 / 143
6.7 提高項目:製作“悅讀圖書榜”網頁 / 144
6.8 拓展項目:製作“環保在行動”網頁 / 145
知識檢測6 / 145
第7章 使用CSS設定表格樣式 / 147
7.1 基礎項目1:製作“神舟系列飛船發射情況表”網頁 / 147
7.2 知識庫:表格的HTML標籤和常用樣式 / 150
7.2.1 表格的HTML標籤 / 150
7.2.2 表格的常用CSS樣式 / 151
7.3 基礎項目2:製作“青銅之美”網頁 / 153
7.4 知識庫:單元格的合併與拆分 / 158
7.5 提高項目:製作“中國二十四節氣—春天篇”網頁 / 159
7.6 拓展項目:製作“中國十大名勝古蹟”網頁 / 160
知識檢測7 / 161
第8章 使用CSS設定表單樣式 / 162
8.1 基礎項目1:製作“信箱註冊”網頁 / 162
8.2 知識庫:常用表單元素類型及結構 / 178
8.2.1 表單標籤 / 178
8.2.2 常用表單元素 / 179
8.2.3 表單按鈕 / 182
8.3 基礎項目2:製作“速遞網——線上下單”網頁 / 184
8.4 知識庫:域集和組 / 192
8.4.1 域集 / 192
8.4.2 組 / 193
8.5 提高項目:製作“商家入駐”網頁 / 194
8.6 拓展項目:製作“快樂數獨”網頁 / 197
知識檢測8 / 197
布 局 篇
第9章 盒子模型 / 199
9.1 基礎項目:根據布局圖創建簡單的盒子模型頁面 / 199
9.2 知識庫:盒子模型的理解與套用 / 201
9.2.1 盒子模型的概念 / 201
9.2.2 盒子模型的計算 / 202
9.2.3 box-sizing屬性 / 203
9.2.4 偽元素 / 204
9.2.5 實際開發中遇到的和盒子模型相關的問題及套用 / 207
9.3 提高項目:創建三列布局的盒子模型 / 210
9.4 拓展項目:製作“專業宣傳”網頁 / 211
知識檢測9 / 212
第10章 CSS標準流布局 / 213
10.1 基礎項目:製作“谷穗兒機構”網頁 / 213
10.1.1 對頁面進行整體布局 / 214
10.1.2 製作頁頭部分 / 215
10.1.3 製作內容部分 / 217
10.1.4 製作頁腳部分 / 222
10.2 知識庫:標準流布局的概念及注意事項 / 223
10.2.1 標準流布局的概念 / 223
10.2.2 標準流布局中的注意事項 / 223
10.3 提高項目:製作“UI設計學院——部落格”網頁 / 225
10.4 拓展項目:製作“簡歷工廠”網頁 / 227
知識檢測10 / 228
第11章 CSS浮動布局 / 229
11.1 基礎項目:製作“UI設計院”網站首頁 / 229
11.1.1 對頁面進行整體布局 / 230
11.1.2 製作頁頭和今日特訊部分 / 232
11.1.3 製作學員活動部分 / 235
11.1.4 製作新聞中心、熱門活動和就業信息板塊 / 239
11.1.5 製作頁腳部分 / 247
11.2 知識庫:浮動布局的原理及套用技巧 / 248
11.2.1 float屬性 / 248
11.2.2 浮動布局的原理 / 249
11.2.3 浮動布局技巧 / 251
11.2.4 消除浮動布局帶來的不良影響 / 253
11.3 提高項目:製作“學校網站新聞列表”網頁 / 256
11.4 拓展項目:製作“咔嚓攝影網”網頁 / 259
知識檢測11 / 260
第12章 CSS定位布局 / 261
12.1 基礎項目:製作“精品購物網”首頁 / 261
12.1.1 對頁面進行整體布局 / 262
12.1.2 製作主體內容區 / 265
12.1.3 製作側邊導航欄 / 272
12.2 知識庫:定位的原理及套用技巧 / 274
12.2.1 CSS定位屬性 / 274
12.2.2 相對定位 / 275
12.2.3 絕對定位 / 277
12.2.4 元素的堆疊順序、溢出和剪裁 / 278
12.3 提高項目:製作“會當凌絕頂—小說投稿”網頁 / 281
12.4 拓展項目:製作“創意照片牆”網頁 / 285
知識檢測12 / 286
應 用 篇
第13章 綜合套用1——製作新大陸集團網站 / 288
13.1 製作網站首頁 / 288
13.1.1 對網頁進行整體布局 / 289
13.1.2 製作頁頭部分 / 291
13.1.3 製作banner部分 / 296
13.1.4 製作主體內容部分 / 300
13.1.5 製作頁腳部分 / 317
13.2 製作網站一級連結頁“合作與商機”頁面 / 318
13.2.1 對網頁進行整體布局 / 319
13.2.2 製作banner部分 / 321
13.2.3 製作主體內容部分 / 321
13.3 製作網站二級連結頁—“軟體公司”頁面 / 328
13.3.1 對網頁進行整體布局 / 329
13.3.2 製作主體內容右側部分 / 331
第14章 綜合套用2——製作麥寵物網站 / 334
14.1 製作網站首頁 / 334
14.1.1 對網頁進行整體布局 / 335
14.1.2 製作頁頭部分 / 337
14.1.3 製作banner部分 / 343
14.1.4 製作“本期星寵”板塊 / 347
14.1.5 製作“萌寵每日推薦”板塊 / 351
14.1.6 製作“更多萌寵推薦”板塊 / 361
14.1.7 製作廣告條板塊 / 366
14.1.8 製作頁腳板塊 / 366
14.1.9 製作右側固定導航欄板塊 / 369
14.2 製作網站一級連結頁“星寵趣事”頁面 / 370
14.2.1 對網頁進行整體布局 / 372
14.2.2 製作星寵banner板塊 / 374
14.2.3 製作分類選項卡 / 375
14.2.4 製作“熱門推薦”板塊 / 376
14.2.5 製作“汪星人”、“喵星人”、“其他”三個板塊的結構和樣式 / 381
14.3 製作網站二級連結頁“星寵趣事詳情”頁面 / 385
14.3.1 對網頁進行整體布局 / 386
14.3.2 製作“趣事詳情”板塊 / 388
14.3.3 製作“Rexie的更多分享”板塊 / 392
14.3.4 製作“右側商品廣告欄”板塊 / 394

熱門詞條

聯絡我們