定 價:59.9 元
叢書名:“十三五”普通高等教育規(guī)劃教材浙江省普通高校新形態(tài)教材項目
- 作者:朱金華
- 出版時間:2018/8/1
- ISBN:9787111602842
- 出 版 社:機械工業(yè)出版社
- 中圖法分類:TP393.092.2
- 頁碼:
- 紙張:膠版紙
- 版次:
- 開本:16開
《網(wǎng)頁設(shè)計與制作 第2版》依照新Web標準(HTML5和CSS3),全程貫穿理論與實踐緊密結(jié)合的思想,有機整合HTML和CSS,使學習過程更接近實際工作。本書共分為4層次,第1~3章是基礎(chǔ),包括網(wǎng)頁設(shè)計基礎(chǔ)、HTML基礎(chǔ)和CSS基礎(chǔ),第4~8章是學生必須重點掌握的內(nèi)容,包括文本樣式與背景、常用Web元素、盒模型(含F(xiàn)lexible Box)、界面設(shè)計(含CSS Grid Layout)和表單,第9~12章以進一步提高學生深入學習的能力為目標,包括JavaScript、網(wǎng)頁多媒體實現(xiàn)、jQuery和移動優(yōu)先的Bootstrap 3響應(yīng)式網(wǎng)頁設(shè)計,第13章是對前面所學知識的綜合實例應(yīng)用,包括網(wǎng)頁仿制實例和基于CMS(Drupal 8)快速構(gòu)建網(wǎng)站實例。
為了更好地指導讀者深入學習,在各章后面的習題中還提供了許多綜合性較強的操作題。
《網(wǎng)頁設(shè)計與制作 第2版》既可作為高等院校本科相關(guān)專業(yè)教材,也可作為有一定基礎(chǔ)的從業(yè)人員的參考書。
首批浙江省普通高校新形態(tài)教材項目,本課程還是省精品在線開放課程。
每個知識點都有相應(yīng)的實例,只要掃描書中的各二維碼即可觀看操作視頻。
遵循新Web標準(HTML5和CSS3。
本書PPT和源代碼將提供給出版社供下載,知識點視頻可通過掃描書中的二維碼觀看。
本書的其他視頻(實驗指導視頻和直播視頻)和相關(guān)資料放在浙江省高等學校在線開放課程共享平臺上。
前 言
隨著移動互聯(lián)網(wǎng)絡(luò)的普及,H5這個稱呼在互聯(lián)網(wǎng)和日常生活中被廣泛使用,但并沒有官方或?qū)W術(shù)界對其進行過嚴格定義,根據(jù)目前情況來看,大概是指HTML5在移動方面的應(yīng)用,所以本次改版的理由為:一方面要全面升級為HTML5+CSS3,另一方面要全面兼容移動應(yīng)用。通過改版,在以下幾個方面得到了提升:編入了最新版瀏覽器支持的HTML5+CSS3的絕大部分有用的知識點,增加了移動優(yōu)先的Bootstrap 4響應(yīng)式網(wǎng)頁設(shè)計內(nèi)容以兼顧移動終端,還有一個基于CMS(Drupal 8)的綜合實例。
本教材第一版是市重點建設(shè)教材,現(xiàn)在的修訂版被立項為首批浙江省普通高校新形態(tài)教材項目。本課程還是省精品在線開放課程,該平臺對所有國內(nèi)的高校都開放,需要使用該平臺的讀者請聯(lián)系作者。
編寫本書的初衷是按照新的Web標準既要實現(xiàn)網(wǎng)頁的結(jié)構(gòu)與表現(xiàn)分離,又要貫徹有機整合HTML和CSS并融入整個學習過程這一思想,使學習過程更接近實際工作。編寫本書的第二個目的就是想做成一本經(jīng)典教材,而不是自學教程,敘述力求精練,盡量涵蓋更多的知識點,有不斷深入的入口,有充分發(fā)揮老師能動性、主導性的機制。全程實驗要求學生動手,自然突出了學生主體性。書中設(shè)置了很多思考點,可以激發(fā)學生學習的積極性,也凸顯了探究式教學方法的自然呈現(xiàn),每章最后都配有操作題型,供學生自主學習和練習。
本書全程貫穿理論與實踐緊密結(jié)合的思想,不僅每個知識點都有相應(yīng)的實例,只要掃描書中的各二維碼即可觀看操作視頻。本書緊跟學科發(fā)展前沿,遵循最新Web標準(HTML5和CSS3),書中大量采用這些新技術(shù),所以希望使用者盡量采用各大瀏覽器(Chrome、Firefox、Edge、Safari或Opera)的最新版,本書所有實例都通過了這些瀏覽器的兼容性測試。
本書除“第 1 章網(wǎng)頁設(shè)計基礎(chǔ)”是理論外,后面各章的知識點都是結(jié)合在實例中的。各個高校根據(jù)自己學生的層次和專業(yè)不同,可靈活地搭配授課內(nèi)容,有些內(nèi)容也可以作為選學。
本書由朱金華、胡秋芬、劉均和何躍編寫。參與本書翻譯、調(diào)試工作的還有李玉仙等,在此一并表示感謝。另外還要感謝學校領(lǐng)導和老師給予的大力支持和幫助,特別感謝多年來使用本教材第1版的老師,你們提出的很多寶貴意見都是我們繼續(xù)堅持的動力。
本書PPT和源代碼將提供給出版社供下載,知識點視頻可通過掃描書中的二維碼觀看。讀者可以使用移動設(shè)備的相關(guān)軟件(如微信、QQ)中的“掃一掃”功能掃描書中的二維碼,在線查看知識點視頻(音頻建議用耳機收聽)。如果“掃一掃”后,在微信端無法打開相關(guān)資源,請選擇用手機瀏覽器或其他軟件的“掃一掃”功能掃描查看。
本書的其他視頻(實驗指導視頻和直播視頻)和相關(guān)資料放在浙江省高等學校在線開放課程共享平臺上,網(wǎng)址http://zjedu.moocollege.com/。需要在浙江省高等學校在線開放課程共享平臺上開課的學?梢月(lián)系本書作者。
書中的源代碼不依賴于任何網(wǎng)頁編輯器,實驗指導對應(yīng)視頻基于Dreamweaver CC 2018.1的實時視圖,知識點視頻基于Visual Studio Code最新版制作。
由于新技術(shù)發(fā)展太快,教材出版始終有滯后性,所以本書會及時提供更新內(nèi)容。請關(guān)注浙江省高等學校在線開放課程共享平臺,或者聯(lián)系出版社索取更新內(nèi)容。
由于時間倉促,書中難免存在不妥之處,請讀者原諒,并提出寶貴意見。
前言
第1章 網(wǎng)頁設(shè)計基礎(chǔ)
1.1 網(wǎng)頁概述
1.2 網(wǎng)站開發(fā)流程
1.3 Web設(shè)計基礎(chǔ)
1.3.1 Web設(shè)計原則
1.3.2 網(wǎng)站結(jié)構(gòu)規(guī)劃
1.4 布局設(shè)計
1.4.1 布局設(shè)計原則
1.4.2 布局設(shè)計類型
1.4.3 布局設(shè)計元素
1.4.4 布局設(shè)計技術(shù)
1.5 內(nèi)容設(shè)計
1.5.1 文本
1.5.2 多媒體
1.5.3 內(nèi)容排版
1.6 風格設(shè)計
1.6.1 網(wǎng)頁設(shè)計構(gòu)成要素
1.6.2 網(wǎng)頁設(shè)計的風格類型
1.7 色彩設(shè)計
1.7.1 色彩基礎(chǔ)
1.7.2 網(wǎng)頁中的色彩
1.7.3 網(wǎng)頁配色方案
1.8 小結(jié)
1.9 思考與練習
第2章 HTML基礎(chǔ)
2.1 HTML文檔結(jié)構(gòu)
2.2 HTML基本語法
2.2.1 標記語法28
2.2.2 屬性語法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 塊級33
2.4.4 wbr和time元素34
2.5 HTML5新增的文檔結(jié)構(gòu)元素35
2.5.1 文章語義(article、header、footer)
元素35
2.5.2 內(nèi)容區(qū)塊語義(section)元素37
2.5.3 側(cè)欄(aside)與導航(nav)元素37
2.5.4 hgroup元素為標題分組38
2.6 小結(jié)38
2.7 思考與練習39
第3章 CSS基礎(chǔ)40
3.1 CSS語法與規(guī)則40
3.2 樣式表的定義與使用42
3.2.1 內(nèi)聯(lián)方式42
3.2.2 內(nèi)部樣式塊對象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 思考與練習53
第4章 文本樣式與背景54
4.1 長度單位與顏色54
4.1.1 長度單位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 思考與練習70
第5章 常用Web元素71
5.1 添加特殊符號71
5.2 圖像71
5.2.1 圖像標簽72
5.2.2 圖像的寬高、間距與邊框72
5.2.3 圖像的對齊方式72
5.2.4 figure元素73
5.3 超鏈接73
5.3.1 創(chuàng)建超鏈接73
5.3.2 鏈接對象75
5.3.3 網(wǎng)頁鏈接屬性設(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 列表符號位置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 思考與練習91
第6章 盒模型92
6.1 盒模型概述92
6.1.1 邊框93
6.1.2 填充94
6.1.3 邊距95
6.2 邊框高級屬性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ù)語100
6.3.4 Flexbox模型的使用102
6.4 小結(jié)106
6.5 思考與練習107
第7章 界面設(shè)計108
7.1 定位與布局108
7.1.1 定位108
7.1.2 浮動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ù)語118
7.4.2 網(wǎng)格容器屬性119
7.4.3 網(wǎng)格項屬性126
7.5 小結(jié)129
7.6 思考與練習129
第8章 表單130
8.1 網(wǎng)頁表單概述130
8.2 傳統(tǒng)表單元素131
8.2.1 傳統(tǒng)表單輸入類型131
8.2.2 標注元素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 思考與練習145
第9章 JavaScript146
9.1 JavaScript簡介146
9.2 JavaScript程序148
9.2.1 語句148
9.2.2 函數(shù)149
9.2.3 消息對話框151
9.3 標識符和變量152
9.3.1 命名規(guī)定152
9.3.2 數(shù)據(jù)類型153
9.3.3 變量153
9.3.4 轉(zhuǎn)義字符155
9.4 運算符和表達式155
9.4.1 算術(shù)運算符和表達式155
9.4.2 賦值運算符和表達式156
9.4.3 關(guān)系運算符和表達式156
9.4.4 邏輯運算符和表達式158
9.4.5 條件運算符和表達式158
9.4.6 其他運算符和表達式159
9.5 JavaScript程序控制結(jié)構(gòu)159
9.5.1 順序程序159
9.5.2 分支程序160
9.5.3 循環(huán)程序163
9.6 常用對象166
9.6.1 對象簡介166
9.6.2 核心對象166
9.6.3 文檔171
9.6.4 窗口174
9.7 事件編程174
9.7.1 事件簡介174
9.7.2 表單事件176
9.7.3 鼠標事件177
9.7.4 鍵盤事件177
9.7.5 頁面載入和離開177
9.8 利用JS實現(xiàn)在線訂購178
9.9 小結(jié)179
9.10 思考與練習179
第10章 網(wǎng)頁多媒體實現(xiàn)180
10.1 HTML多媒體元素180
10.1.1 多媒體元素的基本屬性180
10.1.2 多媒體元素的常用方法183
10.1.3 多媒體元素的重要事件186
10.1.4 Flash動畫與視頻189
10.2 CSS動畫設(shè)計189
10.2.1 CSS變換189
10.2.2 CSS過渡194
10.2.3 CSS動畫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 思考與練習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é)點操作225
11.3.3 遍歷元素229
11.3.4 刪除元素230
11.4 jQuery中的事件231
11.4.1 頁面載入事件231
11.4.2 綁定事件231
11.4.3 切換事件232
11.4.4 移除事件233
11.4.5 trigger方法234
11.5 jQuery動畫與特效234
11.5.1 基本動畫234
11.5.2 滑動動畫237
11.5.3 淡入淡出動畫238
11.5.4 自定義動畫240
11.6 jQuery UI插件243
11.6.1 jQuery UI交互性插件243
11.6.2 jQuery UI微型插件246
11.7 小結(jié)249
11.8 思考與練習250
第12章 響應(yīng)式網(wǎng)頁設(shè)計252
12.1 響應(yīng)式網(wǎng)頁簡介252
12.1.1 響應(yīng)式網(wǎng)頁的優(yōu)點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)頁258
12.2.1 布局259
12.2.2 內(nèi)容263
12.2.3 組件264
12.3 小結(jié)272
12.4 思考與練習272
第13章 綜合實例273
13.1 網(wǎng)頁仿制實例273
13.1.1 導航條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)站實例282
13.2.1 CMS與Drupal282
13.2.2 Drupal基本應(yīng)用284
13.2.3 導入與導出站點294
13.2.4 主題296
13.2.5 內(nèi)容類型300
13.2.6 制作首頁輪播303
13.2.7 自定義首頁區(qū)域311
13.2.8 制作分類列表頁312
13.2.9 添加視頻功能317
13.3 小結(jié)318
13.4 思考與練習319
參考文獻320