案例豐富,配超多視頻。
- 出版商: 清華大學
- 出版日期: 2026-06-01
- 定價: $419
- 售價: $418
- 語言: 簡體中文
- ISBN: 7302716102
- ISBN-13: 9787302716105
-
相關分類:
HTML、CSS、JavaScript
尚未上市,歡迎預購
商品描述
"本書系統地介紹網頁設計與制作的相關知識,內容循序漸進,講解通俗易懂,通過動手練和案例實戰 將理論與實踐相結合,幫助讀者輕松掌握HTML、CSS、JavaScript、jQuery、Bootstrap、Vue.js等知識,並 完成網頁的設計與制作。 全書共12章,由淺入深地對網頁設計與制作進行了全面的講解,主要內容包括網頁基礎知識、 HTML5技術、網頁的基本構成、網頁內容的展示與交互、CSS3世界、CSS3視覺樣式、盒模型、JavaScript 基礎知識、JavaScript前端核心應用、jQuery基礎與應用、Bootstrap的應用,以及漸進式框架Vue.js等。在 講解理論的同時,穿插大量動手練習,讓讀者能夠通過理論聯系實際,達到學以致用的目的。此外,書中 對AIGC的知識及應用技巧進行了針對性的講解,以實現AI賦能基礎學科建設的目標。 本書結構合理、內容精練,易教易學,不僅可以作為各類院校和社會培訓機構的**教材,還可以作 為網頁設計自學者和編程愛好者的參考用書。"
作者簡介
盧來,現任職於湛江科技學院,副教授,主要研究方向:人工智能。主持及參加廣東省科技攻關項目1項,發表SCI/EI 收錄論文1篇,出版規劃教材1部,獲授權國家發明專利1項。
目錄大綱
目 錄
第1章
從零起步:網頁基礎知識詳解
1.1 基礎核心術語 1
1.1.1 Web概述 1
1.1.2 URL和域名 1
1.1.3 服務器 2
1.1.4 HTTP/HTTPS 2
1.1.5 瀏覽器 2
1.1.6 DOM 2
1.1.7 HTML、CSS和JavaScript 3
1.2 認識網頁 4
1.2.1 網頁的定義 4
1.2.2 網頁的核心特征 5
1.2.3 網頁的常見類型 5
1.3 入門必備工具 6
1.3.1 原型設計工具 6
1.3.2 網站開發工具 7
1.3.3 網站調試工具 8
1.4 AIGC輔助 9
1.4.1 創意生成與風格探索 9
1.4.2 內容創作與素材生成 12
1.4.3 代碼生成與補全 13
1.4.4 代碼調試與優化 18
1.5 案例實戰:AIGC生成人物信息網頁 19
1.6 拓展練習 24
第2章
前端骨架:初識HTML5技術
2.1 HTML5概述 25
2.1.1 HTML5的發展史 25
2.1.2 HTML5的優勢 25
2.2 HTML5的基礎知識 26
2.2.1 HTML5語法 26
2.2.2 HTML5元素 27
2.2.3 HTML5屬性 29
2.3 HTML5的文檔結構 31
2.3.1 <!DOCTYPE>文檔類型聲明 31
2.3.2 根標簽<html> 32
2.3.3 頭部標簽<head> 32
2.3.4 標題標簽<title> 32
2.3.5 元數據標簽<meta> 32
2.3.6 主體標簽<body> 33
動手練 AIGC助力詩詞網頁制作 33
2.4 案例實戰:AIGC助力HTML5網頁制作與美化 38
2.5 拓展練習 45
第3章
頁面元素:網頁的基本構成
3.1 網頁中文本的應用 47
3.1.1 標題標簽 47
3.1.2 預格式化文本標簽 48
3.1.3 上標和下標標簽 48
3.1.4 註音標簽 48
3.1.5 高亮文本標簽 49
3.1.6 段落標簽 49
3.1.7 換行標簽 50
動手練 AIGC助力網頁文本優化 50
3.2 網頁中圖片的應用 51
3.2.1 常見的圖片格式 51
3.2.2 插入圖像 52
3.2.3 圖像的提示文本 53
3.2.4 為圖片添加超鏈接 53
動手練 AIGC助力網頁圖文樣式優化 54
3.3 網頁中列表的應用 55
3.3.1 無序列表 55
3.3.2 有序列表 57
3.3.3 定義列表 59
3.3.4 列表嵌套 60
動手練 AIGC助力網頁導航欄優化 61
3.4 案例實戰:AIGC助力春節專題頁面優化 63
3.5 拓展練習 65
第4章
關鍵標簽:網頁內容的展示與交互
4.1 網頁中表格的應用 66
4.1.1 表格的構成 66
4.1.2 表格的標題 67
4.1.3 設置單元格跨度 68
動手練 AIGC優化網頁表格內容 69
4.2 網頁鏈接的應用 71
4.2.1 絕對路徑與相對路徑 71
4.2.2 超鏈接元素 72
4.2.3 超鏈接屬性 72
4.3 網頁多媒體的應用 74
4.3.1 多媒體的定義 74
4.3.2 Web支持的音視頻格式 74
4.3.3 audio元素 75
4.3.4 video元素 75
4.3.5 通用控制屬性 75
4.3.6 視頻專屬屬性 76
4.3.7 audio和video的方法 77
4.3.8 audio和video的事件 78
動手練 AIGC優化視頻播放頁面 78
4.4 網頁表單的應用 80
4.4.1 表單的核心標簽 80
4.4.2 使用form元素 82
4.4.3 使用input元素 83
動手練 AIGC優化表單頁面 84
4.5 案例實戰:AIGC助力生肖網頁設計 85
4.6 拓展練習 88
第5章
樣式基礎:CSS3概述
5.1 認識CSS3 89
5.1.1 CSS的定義 89
5.1.2 CSS3的特征 89
5.1.3 CSS3的優勢 91
5.2 在HTML中使用CSS3 91
5.2.1 內聯樣式 91
5.2.2 嵌入樣式 92
5.2.3 外部樣式 93
動手練 AIGC助力CSS樣式剝離 95
5.3 CSS3選擇器 99
5.3.1 基礎選擇器 99
5.3.2 組合選擇器 99
5.3.3 偽類選擇器 100
5.3.4 屬性選擇器 100
5.3.5 偽元素選擇器 101
動手練 AIGC註釋網頁樣式 102
5.4 案例實戰:AIGC助力樣式調整 105
5.5 拓展練習 110
第6章
樣式進階:CSS3視覺樣式
6.1 文字樣式 111
6.1.1 文本樣式 111
6.1.2 字體樣式 115
6.1.3 文本溢出 115
6.1.4 文本陰影 116
6.1.5 文本換行 117
動手練 AIGC助力響應式效果設計 117
6.2 邊框與背景 120
6.2.1 基礎邊框屬性 120
6.2.2 圓角邊框 121
6.2.3 圖片邊框 122
6.2.4 盒子陰影 123
6.2.5 基礎背景屬性 125
6.2.6 多背景 125
6.2.7 漸變背景 126
動手練 AIGC助力網頁按鈕效果設計 128
6.3 轉換特性 130
6.3.1 2D轉換 130
6.3.2 3D轉換 131
6.4 案例實戰:AIGC助力圓環動畫效果制作 132
6.5 拓展練習 136
第7章
核心布局:盒模型
7.1 盒模型的基礎 137
7.1.1 認識盒模型 137
7.1.2 盒子的基本類型 137
7.1.3 外邊距設置 138
7.1.4 外邊距合並 138
7.1.5 內邊距設置 139
7.1.6 盒模型尺寸 139
7.2 盒模型的屬性設置 140
7.2.1 內容溢出 140
7.2.2 自由縮放 141
7.2.3 外輪廓 141
動手練 AIGC助力矩形縮放 142
7.3 傳統盒模型布局 144
7.3.1 標準流布局 144
7.3.2 浮動布局 144
7.3.3 定位布局 145
7.4 現代盒模型布局 147
7.4.1 彈性盒布局 147
7.4.2 網格布局 148
動手練 AIGC助力導航欄效果制作 149
7.5 案例實戰:AIGC優化網格布局效果 150
7.6 拓展練習 154
第8章
頁面交互:JavaScript基礎知識
8.1 認識JavaScript 155
8.1.1 JavaScript的定義 155
8.1.2 調用方式 155
8.1.3 基本語法規則 157
8.2 核心基礎語法 157
8.2.1 變量與常量 157
8.2.2 數據類型 158
8.2.3 運算符和表達式 159
8.3 流程控制語句 161
8.3.1 條件判斷語句 161
8.3.2 循環語句 162
8.3.3 跳轉控制語句 163
動手練 AIGC助力查詢頁面設計 163
8.4 網頁事件的處理 165
8.4.1 常用的網頁事件 165
8.4.2 事件的綁定方式 166
8.4.3 事件的執行機制 167
動手練 AIGC助力頁面交互 168
8.5 案例實戰:AIGC助力表單驗證 169
8.6 拓展練習 173
第9章
交互進階:JavaScript前端核心應用
9.1 JavaScript函數 174
9.1.1 函數的定義方式 174
9.1.2 函數參數的特性 175
9.1.3 函數調用 176
9.2 網頁數據的處理與存儲 176
9.2.1 數組常用的操作方法 176
9.2.2 對象操作 178
9.2.3 本地存儲 179
9.3 DOM操作 180
9.3.1 獲取HTML元素 180
9.3.2 對HTML元素進行操作 181
動手練 AIGC助力搜索框樣式優化 182
9.4 案例實戰:AIGC助力圖片輪播效果設計 184
9.5 拓展練習 187
第10章
輕量開發:jQuery基礎與應用
10.1 認識jQuery 188
10.2 jQuery的簡單應用 188
10.2.1 引入jQuery庫 188
10.2.2 基本語法 189
10.2.3 選擇器 190
10.2.4 事件 193
10.2.5 常用效果 194
動手練 AIGC助力淡入淡出效果制作 195
10.3 jQuery中的DOM操作 198
10.3.1 DOM操作基礎 198
10.3.2 節點操作 198
10.3.3 屬性操作 200
10.3.4 樣式操作 201
10.3.5 內容操作 201
10.4 jQuery常用插件 202
10.4.1 jQuery插件的定義 202
10.4.2 jQuery UI的基礎 203
10.4.3 jQuery UI的核心功能 203
動手練 AIGC助力圖像亮度調節 204
10.5 案例實戰:AIGC助力手風琴展開效果制作 206
10.6 拓展練習 210
第11章
前端UI框架:Bootstrap的應用
11.1 Bootstrap概述 211
11.1.1 Bootstrap的定義 211
11.1.2 引入Bootstrap 211
11.2 Bootstrap布局 213
11.2.1 布局基礎 213
11.2.2 柵格系統 214
11.2.3 布局工具類 215
11.3 Bootstrap實用工具類 216
11.3.1 文本處理 216
11.3.2 顏色 217
11.3.3 邊框 218
11.3.4 寬高 219
11.3.5 邊距 219
11.3.6 浮動 219
11.3.7 嵌入 220
動手練 AIGC助力網頁內容設計 220
11.4 Bootstrap的CSS組件 222
11.4.1 按鈕 222
11.4.2 導航 224
11.4.3 表單 225
11.4.4 卡片 226
11.4.5 列表組 227
11.4.6 分頁 228
動手練 AIGC助力調研網頁制作 229
11.5 案例實戰:AIGC助力古風插畫網頁建設 233
11.6 拓展練習 236
第12章
漸進式框架:Vue.js
12.1 Vue快速入門 237
12.1.1 Vue的定義 237
12.1.2 Vue的引入方式 237
12.2 Vue核心語法 238
12.2.1 模板語法 238
12.2.2 響應式基礎 239
12.2.3 條件渲染與列表渲染 240
12.2.4 計算屬性與偵聽器 242
12.3 Vue組件化設計 243
12.3.1 組件的定義與使用 244
12.3.2 組件通信 246
12.3.3 生命周期 248
動手練 AIGC助力待辦事項清單制作 249
12.4 案例實戰:AIGC助力計算器制作 251
12.5 拓展練習 251







