網(wǎng)頁(yè)設(shè)計(jì)與制作 第2版
定 價(jià):59.9 元
叢書名:“十三五”普通高等教育規(guī)劃教材浙江省普通高校新形態(tài)教材項(xiàng)目
- 作者:朱金華
- 出版時(shí)間:2018/8/1
- ISBN:9787111602842
- 出 版 社:機(jī)械工業(yè)出版社
- 中圖法分類:TP393.092.2
- 頁(yè)碼:
- 紙張:膠版紙
- 版次:
- 開本:16開
《網(wǎng)頁(yè)設(shè)計(jì)與制作 第2版》依照新Web標(biāo)準(zhǔn)(HTML5和CSS3),全程貫穿理論與實(shí)踐緊密結(jié)合的思想,有機(jī)整合HTML和CSS,使學(xué)習(xí)過程更接近實(shí)際工作。本書共分為4層次,第1~3章是基礎(chǔ),包括網(wǎng)頁(yè)設(shè)計(jì)基礎(chǔ)、HTML基礎(chǔ)和CSS基礎(chǔ),第4~8章是學(xué)生必須重點(diǎn)掌握的內(nèi)容,包括文本樣式與背景、常用Web元素、盒模型(含F(xiàn)lexible Box)、界面設(shè)計(jì)(含CSS Grid Layout)和表單,第9~12章以進(jìn)一步提高學(xué)生深入學(xué)習(xí)的能力為目標(biāo),包括JavaScript、網(wǎng)頁(yè)多媒體實(shí)現(xiàn)、jQuery和移動(dòng)優(yōu)先的Bootstrap 3響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì),第13章是對(duì)前面所學(xué)知識(shí)的綜合實(shí)例應(yīng)用,包括網(wǎng)頁(yè)仿制實(shí)例和基于CMS(Drupal 8)快速構(gòu)建網(wǎng)站實(shí)例。
為了更好地指導(dǎo)讀者深入學(xué)習(xí),在各章后面的習(xí)題中還提供了許多綜合性較強(qiáng)的操作題。
《網(wǎng)頁(yè)設(shè)計(jì)與制作 第2版》既可作為高等院校本科相關(guān)專業(yè)教材,也可作為有一定基礎(chǔ)的從業(yè)人員的參考書。
首批浙江省普通高校新形態(tài)教材項(xiàng)目,本課程還是省精品在線開放課程。
每個(gè)知識(shí)點(diǎn)都有相應(yīng)的實(shí)例,只要掃描書中的各二維碼即可觀看操作視頻。
遵循新Web標(biāo)準(zhǔn)(HTML5和CSS3。
本書PPT和源代碼將提供給出版社供下載,知識(shí)點(diǎn)視頻可通過掃描書中的二維碼觀看。
本書的其他視頻(實(shí)驗(yàn)指導(dǎo)視頻和直播視頻)和相關(guān)資料放在浙江省高等學(xué)校在線開放課程共享平臺(tái)上。
前 言
隨著移動(dòng)互聯(lián)網(wǎng)絡(luò)的普及,H5這個(gè)稱呼在互聯(lián)網(wǎng)和日常生活中被廣泛使用,但并沒有官方或?qū)W術(shù)界對(duì)其進(jìn)行過嚴(yán)格定義,根據(jù)目前情況來看,大概是指HTML5在移動(dòng)方面的應(yīng)用,所以本次改版的理由為:一方面要全面升級(jí)為HTML5+CSS3,另一方面要全面兼容移動(dòng)應(yīng)用。通過改版,在以下幾個(gè)方面得到了提升:編入了最新版瀏覽器支持的HTML5+CSS3的絕大部分有用的知識(shí)點(diǎn),增加了移動(dòng)優(yōu)先的Bootstrap 4響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)內(nèi)容以兼顧移動(dòng)終端,還有一個(gè)基于CMS(Drupal 8)的綜合實(shí)例。
本教材第一版是市重點(diǎn)建設(shè)教材,現(xiàn)在的修訂版被立項(xiàng)為首批浙江省普通高校新形態(tài)教材項(xiàng)目。本課程還是省精品在線開放課程,該平臺(tái)對(duì)所有國(guó)內(nèi)的高校都開放,需要使用該平臺(tái)的讀者請(qǐng)聯(lián)系作者。
編寫本書的初衷是按照新的Web標(biāo)準(zhǔn)既要實(shí)現(xiàn)網(wǎng)頁(yè)的結(jié)構(gòu)與表現(xiàn)分離,又要貫徹有機(jī)整合HTML和CSS并融入整個(gè)學(xué)習(xí)過程這一思想,使學(xué)習(xí)過程更接近實(shí)際工作。編寫本書的第二個(gè)目的就是想做成一本經(jīng)典教材,而不是自學(xué)教程,敘述力求精練,盡量涵蓋更多的知識(shí)點(diǎn),有不斷深入的入口,有充分發(fā)揮老師能動(dòng)性、主導(dǎo)性的機(jī)制。全程實(shí)驗(yàn)要求學(xué)生動(dòng)手,自然突出了學(xué)生主體性。書中設(shè)置了很多思考點(diǎn),可以激發(fā)學(xué)生學(xué)習(xí)的積極性,也凸顯了探究式教學(xué)方法的自然呈現(xiàn),每章最后都配有操作題型,供學(xué)生自主學(xué)習(xí)和練習(xí)。
本書全程貫穿理論與實(shí)踐緊密結(jié)合的思想,不僅每個(gè)知識(shí)點(diǎn)都有相應(yīng)的實(shí)例,只要掃描書中的各二維碼即可觀看操作視頻。本書緊跟學(xué)科發(fā)展前沿,遵循最新Web標(biāo)準(zhǔn)(HTML5和CSS3),書中大量采用這些新技術(shù),所以希望使用者盡量采用各大瀏覽器(Chrome、Firefox、Edge、Safari或Opera)的最新版,本書所有實(shí)例都通過了這些瀏覽器的兼容性測(cè)試。
本書除“第 1 章網(wǎng)頁(yè)設(shè)計(jì)基礎(chǔ)”是理論外,后面各章的知識(shí)點(diǎn)都是結(jié)合在實(shí)例中的。各個(gè)高校根據(jù)自己學(xué)生的層次和專業(yè)不同,可靈活地搭配授課內(nèi)容,有些內(nèi)容也可以作為選學(xué)。
本書由朱金華、胡秋芬、劉均和何躍編寫。參與本書翻譯、調(diào)試工作的還有李玉仙等,在此一并表示感謝。另外還要感謝學(xué)校領(lǐng)導(dǎo)和老師給予的大力支持和幫助,特別感謝多年來使用本教材第1版的老師,你們提出的很多寶貴意見都是我們繼續(xù)堅(jiān)持的動(dòng)力。
本書PPT和源代碼將提供給出版社供下載,知識(shí)點(diǎn)視頻可通過掃描書中的二維碼觀看。讀者可以使用移動(dòng)設(shè)備的相關(guān)軟件(如微信、QQ)中的“掃一掃”功能掃描書中的二維碼,在線查看知識(shí)點(diǎn)視頻(音頻建議用耳機(jī)收聽)。如果“掃一掃”后,在微信端無法打開相關(guān)資源,請(qǐng)選擇用手機(jī)瀏覽器或其他軟件的“掃一掃”功能掃描查看。
本書的其他視頻(實(shí)驗(yàn)指導(dǎo)視頻和直播視頻)和相關(guān)資料放在浙江省高等學(xué)校在線開放課程共享平臺(tái)上,網(wǎng)址http://zjedu.moocollege.com/。需要在浙江省高等學(xué)校在線開放課程共享平臺(tái)上開課的學(xué)校可以聯(lián)系本書作者。
書中的源代碼不依賴于任何網(wǎng)頁(yè)編輯器,實(shí)驗(yàn)指導(dǎo)對(duì)應(yīng)視頻基于Dreamweaver CC 2018.1的實(shí)時(shí)視圖,知識(shí)點(diǎn)視頻基于Visual Studio Code最新版制作。
由于新技術(shù)發(fā)展太快,教材出版始終有滯后性,所以本書會(huì)及時(shí)提供更新內(nèi)容。請(qǐng)關(guān)注浙江省高等學(xué)校在線開放課程共享平臺(tái),或者聯(lián)系出版社索取更新內(nèi)容。
由于時(shí)間倉(cāng)促,書中難免存在不妥之處,請(qǐng)讀者原諒,并提出寶貴意見。
前言
第1章 網(wǎng)頁(yè)設(shè)計(jì)基礎(chǔ)
1.1 網(wǎng)頁(yè)概述
1.2 網(wǎng)站開發(fā)流程
1.3 Web設(shè)計(jì)基礎(chǔ)
1.3.1 Web設(shè)計(jì)原則
1.3.2 網(wǎng)站結(jié)構(gòu)規(guī)劃
1.4 布局設(shè)計(jì)
1.4.1 布局設(shè)計(jì)原則
1.4.2 布局設(shè)計(jì)類型
1.4.3 布局設(shè)計(jì)元素
1.4.4 布局設(shè)計(jì)技術(shù)
1.5 內(nèi)容設(shè)計(jì)
1.5.1 文本
1.5.2 多媒體
1.5.3 內(nèi)容排版
1.6 風(fēng)格設(shè)計(jì)
1.6.1 網(wǎng)頁(yè)設(shè)計(jì)構(gòu)成要素
1.6.2 網(wǎng)頁(yè)設(shè)計(jì)的風(fēng)格類型
1.7 色彩設(shè)計(jì)
1.7.1 色彩基礎(chǔ)
1.7.2 網(wǎng)頁(yè)中的色彩
1.7.3 網(wǎng)頁(yè)配色方案
1.8 小結(jié)
1.9 思考與練習(xí)
第2章 HTML基礎(chǔ)
2.1 HTML文檔結(jié)構(gòu)
2.2 HTML基本語(yǔ)法
2.2.1 標(biāo)記語(yǔ)法28
2.2.2 屬性語(yǔ)法29
2.2.3 命名規(guī)則30
2.3 塊元素與內(nèi)聯(lián)元素30
2.4 HTML的格式元素31
2.4.1 字符格式化31
2.4.2 輸出32
2.4.3 塊級(jí)33
2.4.4 wbr和time元素34
2.5 HTML5新增的文檔結(jié)構(gòu)元素35
2.5.1 文章語(yǔ)義(article、header、footer)
元素35
2.5.2 內(nèi)容區(qū)塊語(yǔ)義(section)元素37
2.5.3 側(cè)欄(aside)與導(dǎo)航(nav)元素37
2.5.4 hgroup元素為標(biāo)題分組38
2.6 小結(jié)38
2.7 思考與練習(xí)39
第3章 CSS基礎(chǔ)40
3.1 CSS語(yǔ)法與規(guī)則40
3.2 樣式表的定義與使用42
3.2.1 內(nèi)聯(lián)方式42
3.2.2 內(nèi)部樣式塊對(duì)象42
3.2.3 外部樣式表43
3.3 選擇器43
3.3.1 基本選擇器44
3.3.2 層次選擇器45
3.3.3 屬性選擇器47
3.3.4 偽類選擇器48
3.3.5 偽元素選擇器52
3.4 小結(jié)53
3.5 思考與練習(xí)53
第4章 文本樣式與背景54
4.1 長(zhǎng)度單位與顏色54
4.1.1 長(zhǎng)度單位54
4.1.2 顏色設(shè)置方法55
4.2 文本排版樣式56
4.2.1 文本樣式56
4.2.2 排版樣式58
4.2.3 文本裝飾61
4.3 背景樣式62
4.3.1 基本背景屬性62
4.3.2 多重背景圖像63
4.3.3 CSS3新增背景屬性64
4.3.4 漸變背景66
4.4 小結(jié)69
4.5 思考與練習(xí)70
第5章 常用Web元素71
5.1 添加特殊符號(hào)71
5.2 圖像71
5.2.1 圖像標(biāo)簽72
5.2.2 圖像的寬高、間距與邊框72
5.2.3 圖像的對(duì)齊方式72
5.2.4 figure元素73
5.3 超鏈接73
5.3.1 創(chuàng)建超鏈接73
5.3.2 鏈接對(duì)象75
5.3.3 網(wǎng)頁(yè)鏈接屬性設(shè)置78
5.3.4 圖像映射78
5.4 列表79
5.4.1 無序列表79
5.4.2 有序列表80
5.4.3 嵌套列表82
5.4.4 定義列表82
5.4.5 菜單列表83
5.4.6 圖像列表84
5.4.7 列表符號(hào)位置84
5.5 表格85
5.5.1 表格元素85
5.5.2 表格修飾87
5.5.3 設(shè)置表格行屬性88
5.5.4 設(shè)置單元格屬性88
5.5.5 單線表格的制作89
5.5.6 表格的嵌套90
5.6 內(nèi)聯(lián)框架90
5.7 小結(jié)91
5.8 思考與練習(xí)91
第6章 盒模型92
6.1 盒模型概述92
6.1.1 邊框93
6.1.2 填充94
6.1.3 邊距95
6.2 邊框高級(jí)屬性95
6.2.1 圓角邊框95
6.2.2 盒陰影97
6.2.3 圖像邊框97
6.3 伸縮盒99
6.3.1 CSS中的布局模式99
6.3.2 Flexbox模型的功能99
6.3.3 Flexbox模型的相關(guān)術(shù)語(yǔ)100
6.3.4 Flexbox模型的使用102
6.4 小結(jié)106
6.5 思考與練習(xí)107
第7章 界面設(shè)計(jì)108
7.1 定位與布局108
7.1.1 定位108
7.1.2 浮動(dòng)109
7.1.3 顯示110
7.1.4 溢出112
7.2 用戶界面113
7.2.1 輪廓113
7.2.2 放大113
7.2.3 盒模型組成模式114
7.2.4 允許縮放114
7.3 多列115
7.3.1 多列的基本屬性115
7.3.2 列間距116
7.3.3 列邊框116
7.3.4 跨列117
7.3.5 列高117
7.3.6 斷行118
7.4 CSS網(wǎng)格布局118
7.4.1 重要術(shù)語(yǔ)118
7.4.2 網(wǎng)格容器屬性119
7.4.3 網(wǎng)格項(xiàng)屬性126
7.5 小結(jié)129
7.6 思考與練習(xí)129
第8章 表單130
8.1 網(wǎng)頁(yè)表單概述130
8.2 傳統(tǒng)表單元素131
8.2.1 傳統(tǒng)表單輸入類型131
8.2.2 標(biāo)注元素135
8.2.3 文本區(qū)域136
8.2.4 選擇域137
8.2.5 域集138
8.3 HTML5表單的新特性139
8.3.1 HTML5新增表單輸入類型139
8.3.2 HTML5新增表單元素141
8.3.3 HTML5新增表單屬性142
8.4 小結(jié)145
8.5 思考與練習(xí)145
第9章 JavaScript146
9.1 JavaScript簡(jiǎn)介146
9.2 JavaScript程序148
9.2.1 語(yǔ)句148
9.2.2 函數(shù)149
9.2.3 消息對(duì)話框151
9.3 標(biāo)識(shí)符和變量152
9.3.1 命名規(guī)定152
9.3.2 數(shù)據(jù)類型153
9.3.3 變量153
9.3.4 轉(zhuǎn)義字符155
9.4 運(yùn)算符和表達(dá)式155
9.4.1 算術(shù)運(yùn)算符和表達(dá)式155
9.4.2 賦值運(yùn)算符和表達(dá)式156
9.4.3 關(guān)系運(yùn)算符和表達(dá)式156
9.4.4 邏輯運(yùn)算符和表達(dá)式158
9.4.5 條件運(yùn)算符和表達(dá)式158
9.4.6 其他運(yùn)算符和表達(dá)式159
9.5 JavaScript程序控制結(jié)構(gòu)159
9.5.1 順序程序159
9.5.2 分支程序160
9.5.3 循環(huán)程序163
9.6 常用對(duì)象166
9.6.1 對(duì)象簡(jiǎn)介166
9.6.2 核心對(duì)象166
9.6.3 文檔171
9.6.4 窗口174
9.7 事件編程174
9.7.1 事件簡(jiǎn)介174
9.7.2 表單事件176
9.7.3 鼠標(biāo)事件177
9.7.4 鍵盤事件177
9.7.5 頁(yè)面載入和離開177
9.8 利用JS實(shí)現(xiàn)在線訂購(gòu)178
9.9 小結(jié)179
9.10 思考與練習(xí)179
第10章 網(wǎng)頁(yè)多媒體實(shí)現(xiàn)180
10.1 HTML多媒體元素180
10.1.1 多媒體元素的基本屬性180
10.1.2 多媒體元素的常用方法183
10.1.3 多媒體元素的重要事件186
10.1.4 Flash動(dòng)畫與視頻189
10.2 CSS動(dòng)畫設(shè)計(jì)189
10.2.1 CSS變換189
10.2.2 CSS過渡194
10.2.3 CSS動(dòng)畫195
10.3 HTML繪圖197
10.3.1 canvas元素的基本用法197
10.3.2 繪制基本圖形198
10.3.3 繪制曲線200
10.3.4 繪制文本203
10.3.5 圖像的繪制與裁切204
10.4 HTML拖放206
10.5 小結(jié)207
10.6 思考與練習(xí)208
第11章 jQuery209
11.1 jQuery概述209
11.2 jQuery選擇器211
11.2.1 基本選擇器211
11.2.2 層次選擇器212
11.2.3 過濾選擇器213
11.2.4 表單選擇器218
11.3 jQuery操作DOM220
11.3.1 訪問元素220
11.3.2 結(jié)點(diǎn)操作225
11.3.3 遍歷元素229
11.3.4 刪除元素230
11.4 jQuery中的事件231
11.4.1 頁(yè)面載入事件231
11.4.2 綁定事件231
11.4.3 切換事件232
11.4.4 移除事件233
11.4.5 trigger方法234
11.5 jQuery動(dòng)畫與特效234
11.5.1 基本動(dòng)畫234
11.5.2 滑動(dòng)動(dòng)畫237
11.5.3 淡入淡出動(dòng)畫238
11.5.4 自定義動(dòng)畫240
11.6 jQuery UI插件243
11.6.1 jQuery UI交互性插件243
11.6.2 jQuery UI微型插件246
11.7 小結(jié)249
11.8 思考與練習(xí)250
第12章 響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)252
12.1 響應(yīng)式網(wǎng)頁(yè)簡(jiǎn)介252
12.1.1 響應(yīng)式網(wǎng)頁(yè)的優(yōu)點(diǎn)252
12.1.2 響應(yīng)式的概念253
12.1.3 Viewport253
12.1.4 流式網(wǎng)格254
12.1.5 媒體查詢255
12.1.6 圖像、視頻與字體257
12.2 Bootstrap響應(yīng)式網(wǎng)頁(yè)258
12.2.1 布局259
12.2.2 內(nèi)容263
12.2.3 組件264
12.3 小結(jié)272
12.4 思考與練習(xí)272
第13章 綜合實(shí)例273
13.1 網(wǎng)頁(yè)仿制實(shí)例273
13.1.1 導(dǎo)航條274
13.1.2 輪播275
13.1.3 自定義區(qū)域276
13.1.4 Services區(qū)域278
13.1.5 Portfolio區(qū)域279
13.1.6 Contact區(qū)域281
13.2 基于CMS快速構(gòu)建網(wǎng)站實(shí)例282
13.2.1 CMS與Drupal282
13.2.2 Drupal基本應(yīng)用284
13.2.3 導(dǎo)入與導(dǎo)出站點(diǎn)294
13.2.4 主題296
13.2.5 內(nèi)容類型300
13.2.6 制作首頁(yè)輪播303
13.2.7 自定義首頁(yè)區(qū)域311
13.2.8 制作分類列表頁(yè)312
13.2.9 添加視頻功能317
13.3 小結(jié)318
13.4 思考與練習(xí)319
參考文獻(xiàn)320