HTML5+CSS3+jQuery Mobile移動網(wǎng)站與App開發(fā)實戰(zhàn)（視頻講解版）
本書分為三個部分。第 一部分介紹HTML5各方面的知識點，重點介紹繪圖、音頻和視頻、新型表單等；第 二部分介紹CSS樣式各屬性的設(shè)置和使用方法，重點介紹CSS 3.0中新增的相關(guān)屬性以及CSS動畫的制作方法；第三部分介紹了jQuery Mobile的相關(guān)知識，并通過實用案例講解了綜合運(yùn)用HTML5、CSS 3和jQuery Mobile開發(fā)移動應(yīng)用的方法和技巧。
1.內(nèi)容全面
本書內(nèi)容全面，基本包括了HTML 5、CSS 3和jQuery Mobile的各個方面知識。
2.以實例為中心
脫離單純的知識點講解，通過150個實例與知識點相結(jié)合的方式進(jìn)行講解，生動、貼切地詮釋了知識點在實際工作中的應(yīng)用。
3.語言簡潔流暢
本書語言流暢、圖文并茂。書中以大量的實例講解在實際移動應(yīng)用開發(fā)中的制作方法和技巧，避免了枯燥無味的說教。
4.視頻輔助教學(xué)
600分鐘配套視頻，將實例的制作與教學(xué)視頻相結(jié)合，使得枯燥的內(nèi)容更加容易理解。
本書作者編寫過多本設(shè)計類、前端開發(fā)類暢銷圖書，包括《7天精通Photoshop CS6 UI交互設(shè)計》、《網(wǎng)站用戶體驗設(shè)計全程揭秘》、《中文版Photoshop CS6完全自學(xué)一本通》等，重印多次，深受讀者好評。
第一篇 HTML5基礎(chǔ)
第1章 HTML和HTML5基礎(chǔ) 2
1.1 HTML基礎(chǔ) 2
1.1.1 什么是HTML 2
1.1.2 HTML的主要功能 3
1.1.3 HTML的編輯環(huán)境 3
1.1.4 認(rèn)識Dreamweaver中的代碼工具 4
1.2 HTML5基礎(chǔ) 6
1.2.1 HTML5概述 6
1.2.2 HTML5的優(yōu)勢 6
1.3 認(rèn)識HTML5 7
1.3.1 HTML5的文檔結(jié)構(gòu) 7
1.3.2 HTML5的基本語法 8
1.3.3 HTML5精簡的頭部 8
1.4 HTML5中新增的標(biāo)簽 9
1.4.1 結(jié)構(gòu)標(biāo)簽 9
1.4.2 文本標(biāo)簽 9
1.4.3 應(yīng)用和輔助標(biāo)簽 10
1.4.4 進(jìn)度標(biāo)簽 10
1.4.5 交互性標(biāo)簽 10
1.4.6 在文檔和應(yīng)用中使用的標(biāo)簽 10
1.4.7 標(biāo)簽 11
1.4.8 其他標(biāo)簽 11
1.5 HTML5中廢棄的標(biāo)簽 11
1.6 本章小結(jié) 12
1.7 課后習(xí)題 12
第2章 HTML中的主體標(biāo)簽 13
2.1 HTML頭部標(biāo)簽設(shè)置 13
2.1.1 標(biāo)簽 13
練習(xí)——為網(wǎng)頁設(shè)置標(biāo)題 13
2.1.2 <base href="http://m.dlnsoft.cn/"/>標(biāo)簽 14
2.1.3 <meta>標(biāo)簽 14
練習(xí)——設(shè)置網(wǎng)頁關(guān)鍵字、說明以及頁面的定時跳轉(zhuǎn) 16
2.2 HTML主體<body>標(biāo)簽設(shè)置 17
2.2.1 邊距屬性margin 17
練習(xí)——設(shè)置網(wǎng)頁整體邊距 17
2.2.2 背景顏色屬性bgcolor 18
練習(xí)——設(shè)置網(wǎng)頁背景顏色 18
2.2.3 背景圖像屬性background 19
練習(xí)——設(shè)置網(wǎng)頁背景圖像 19
2.2.4 文字屬性text 20
練習(xí)——設(shè)置網(wǎng)頁文字默認(rèn)顏色 20
2.2.5 默認(rèn)鏈接屬性link 21
練習(xí)——設(shè)置網(wǎng)頁中超鏈接文字的默認(rèn)顏色 21
2.3 在HTML代碼中添加注釋 22
2.4 本章小結(jié) 23
2.5 課后習(xí)題 23
第3章 HTML中基礎(chǔ)標(biāo)簽的應(yīng)用 24
3.1 文字設(shè)置標(biāo)簽 24
3.1.1 <font>標(biāo)簽 24
練習(xí)——使用<font>標(biāo)簽設(shè)置網(wǎng)頁文字效果 25
3.1.2 <b>和<strong>標(biāo)簽實現(xiàn)文字加粗 26
3.1.3 <i>和<em>標(biāo)簽實現(xiàn)文字傾斜 26
3.1.4 <u>標(biāo)簽實現(xiàn)文字下畫線 26
練習(xí)——為文字添加加粗、傾斜和下畫線修飾 27
3.1.5 其他文字修飾標(biāo)簽 28
練習(xí)——為文字添加上標(biāo)和刪除線 28
3.2 分行與分段標(biāo)簽 29
3.2.1 使用<br>標(biāo)簽為文本分行 29
練習(xí)——為網(wǎng)頁中的文本進(jìn)行分行處理 29
3.2.2 使用<p>標(biāo)簽為文本分段 31
練習(xí)——為網(wǎng)頁中的文本進(jìn)行分段處理 31
3.2.3 <h1>至<h6>標(biāo)簽 31
練習(xí)——設(shè)置文本標(biāo)題 32
3.2.4 <hr>標(biāo)簽 32
練習(xí)——在網(wǎng)頁中插入水平線 33
3.2.5 文本對齊設(shè)置 33
練習(xí)——設(shè)置網(wǎng)頁文本對齊 34
3.2.6 在HTML中插入空格和特殊字符 35
練習(xí)——在網(wǎng)頁中輸入空格和特殊字符 35
3.3 圖片標(biāo)簽設(shè)置 36
3.3.1 <img>標(biāo)簽 36
練習(xí)——在網(wǎng)頁中插入圖片 37
3.3.2 圖文混排 38
練習(xí)——制作圖文介紹頁面 38
3.4 列表標(biāo)簽設(shè)置 39
3.4.1 使用<ul>標(biāo)簽創(chuàng)建項目列表 40
練習(xí)——制作新聞列表 40
3.4.2 使用<ol>標(biāo)簽創(chuàng)建編號列表 41
練習(xí)——制作編號有序列表 41
3.4.3 使用<dl>標(biāo)簽創(chuàng)建定義列表 43
練習(xí)——制作復(fù)雜的新聞列表 43
3.5 超鏈接標(biāo)簽設(shè)置 44
3.5.1 超鏈接<a>標(biāo)簽 44
3.5.2 相對鏈接和絕對鏈接 45
練習(xí)——在網(wǎng)頁中創(chuàng)建超鏈接 45
3.5.3 網(wǎng)頁中的特殊超鏈接 46
練習(xí)——在網(wǎng)頁中創(chuàng)建特殊超鏈接 46
3.5.4 超鏈接標(biāo)簽中的其他屬性設(shè)置 48
3.6 表格標(biāo)簽設(shè)置 49
3.6.1 表格的基本構(gòu)成<table>、<tr>和<td>標(biāo)簽 49
3.6.2 表格標(biāo)題<caption>標(biāo)簽 49
練習(xí)——創(chuàng)建數(shù)據(jù)表格 50
3.6.3 表頭<thead>、表主體<tbody>和表尾<tfoot>標(biāo)簽 51
練習(xí)——設(shè)置表格中的表頭、表主體和表尾 51
3.7 本章小結(jié) 52
3.8 課后習(xí)題 53
第4章 HTML中表單標(biāo)簽的應(yīng)用 54
4.1 了解HTML中的表單 54
4.1.1 表單的作用 54
4.1.2 <form>標(biāo)簽 54
4.1.3 表單的數(shù)據(jù)傳遞方式 55
4.2 普通的HTML表單元素 55
4.2.1 文本域 55
4.2.2 密碼域 55
4.2.3 文本區(qū)域 56
4.2.4 隱藏域 56
4.2.5 復(fù)選框 56
4.2.6 單選按鈕 56
4.2.7 選擇域 56
4.2.8 文件域 57
4.2.9 按鈕 57
4.2.10 圖像域 57
練習(xí)——制作登錄表單 58
4.3 HTML5新增表單輸入類型 61
4.3.1 url類型 61
4.3.2 email類型 61
4.3.3 range類型 61
4.3.4 number類型 61
4.3.5 tel類型 62
4.3.6 search類型 62
4.3.7 color類型 62
4.3.8 date類型 62
4.3.9 month、week、time、datetime、datetime-local類型 63
練習(xí)——制作留言表單頁面 63
4.3.10 瀏覽器對HTML5表單的支持情況 65
4.4 HTML5新增表單屬性 65
4.4.1 form屬性 66
4.4.2 formaction屬性 66
4.4.3 formmethod、formenctype、formnovalidate、formtarget屬性 66
4.4.4 placeholder屬性 66
4.4.5 autofocus屬性 67
練習(xí)——為表單元素設(shè)置默認(rèn)提示內(nèi)容 67
4.4.6 autocomplete屬性 68
4.5 使用HTML5表單驗證 68
4.5.1 與驗證有關(guān)的表單元素屬性 68
練習(xí)——驗證網(wǎng)頁表單元素 69
4.5.2 表單驗證方法 70
4.5.3 表單驗證事件 72
4.6 本章小結(jié) 73
4.7 課后習(xí)題 73
第5章 HTML中多媒體標(biāo)簽的應(yīng)用 74
5.1 使用<embed>標(biāo)簽 74
5.1.1 使用<embed>標(biāo)簽嵌入音頻 74
練習(xí)——在網(wǎng)頁中嵌入音頻 75
5.1.2 使用<embed>標(biāo)簽嵌入視頻 75
練習(xí)——在網(wǎng)頁中嵌入視頻 76
5.2 了解HTML5中多媒體的應(yīng)用 76
5.2.1 在線多媒體的發(fā)展 77
5.2.2 檢查瀏覽器是否支持<audio>和<video>標(biāo)簽 77
5.3 HTML5新增<audio>標(biāo)簽的應(yīng)用 77
5.3.1 <audio>標(biāo)簽所支持的音頻格式 77
5.3.2 使用<audio>標(biāo)簽 77
練習(xí)——在網(wǎng)頁中嵌入音頻播放 78
5.4 HTML5新增<video>標(biāo)簽的應(yīng)用 79
5.4.1 <video>標(biāo)簽所支持的視頻格式 79
5.4.2 使用<video>標(biāo)簽 79
練習(xí)——在網(wǎng)頁中嵌入視頻播放 79
5.4.3 使用<source>標(biāo)簽 80
5.5 <audio>與<video>標(biāo)簽的屬性 81
5.5.1 元素的標(biāo)簽屬性 81
5.5.2 元素的接口屬性 82
練習(xí)——實現(xiàn)網(wǎng)頁中視頻的快進(jìn)控制 83
5.6 <audio>與<video>標(biāo)簽的接口方法 84
練習(xí)——控制網(wǎng)頁中視頻的播放和暫�！�85
5.7 <audio>與<video>標(biāo)簽的事件 86
練習(xí)——自定義視頻播放控制組件 87
5.8 本章小結(jié) 91
5.9 課后習(xí)題 91
第6章 HTML5中<canvas>標(biāo)簽的應(yīng)用 93
6.1 <canvas>標(biāo)簽 93
6.1.1 了解<canvas>標(biāo)簽 93
6.1.2 在網(wǎng)頁中使用<canvas>標(biāo)簽 93
6.1.3 使用<canvas>標(biāo)簽實現(xiàn)繪圖的流程 94
6.2 繪制基本圖形 95
6.2.1 繪制直線 95
練習(xí)——在網(wǎng)頁中繪制直線 95
6.2.2 繪制矩形 96
練習(xí)——在網(wǎng)頁中繪制矩形 97
6.2.3 繪制圓形 98
練習(xí)——在網(wǎng)頁中繪制圓形 99
6.2.4 繪制三角形 100
練習(xí)——在網(wǎng)頁中繪制三角形 100
6.2.5 圖形組合 102
6.3 繪制文本 103
6.3.1 使用文本 103
練習(xí)——在網(wǎng)頁中繪制文字 104
6.3.2 創(chuàng)建對象陰影 105
練習(xí)——為網(wǎng)頁中所繪制文字添加陰影 105
6.4 在網(wǎng)頁中實現(xiàn)特殊形狀圖像 106
6.4.1 繪制圖像 106
練習(xí)——在網(wǎng)頁中繪制圖像 107
6.4.2 裁切區(qū)域 108
練習(xí)——在網(wǎng)頁中實現(xiàn)圓形圖像效果 108
6.5 本章小結(jié) 110
6.6 課后習(xí)題 110
第7章 HTML5中文檔結(jié)構(gòu)標(biāo)簽的應(yīng)用 111
7.1 構(gòu)建HTML5頁面主體內(nèi)容 111
7.1.1 文章<article>標(biāo)簽 111
7.1.2 章節(jié)<section>標(biāo)簽 113
7.1.3 導(dǎo)航<nav>標(biāo)簽 115
7.1.4 輔助內(nèi)容<aside>標(biāo)簽 116
7.1.5 日期時間<time>標(biāo)簽 117
7.2 HTML5文檔中的語義模塊標(biāo)簽 117
7.2.1 標(biāo)題<header>標(biāo)簽 117
7.2.2 標(biāo)題分組<hgroup>標(biāo)簽 118
7.2.3 頁腳<footer>標(biāo)簽 119
7.2.4 聯(lián)系信息<address>標(biāo)簽 120
7.3 制作HTML5文章頁面 121
練習(xí)——制作HTML5文章頁面 121
7.4 本章小結(jié) 125
7.5 課后習(xí)題 125
第二篇 CSS樣式
第8章 CSS樣式基礎(chǔ) 127
8.1 了解CSS樣式 127
8.1.1 什么是CSS樣式 127
8.1.2 CSS樣式的發(fā)展 127
8.2 CSS樣式語法 128
8.2.1 CSS樣式的基本語法 128
8.2.2 CSS規(guī)則構(gòu)成 129
8.3 CSS樣式選擇器 130
8.3.1 通配選擇器 130
8.3.2 標(biāo)簽選擇器 130
練習(xí)——創(chuàng)建通配選擇器和標(biāo)簽選擇器 130
8.3.3 ID選擇器 132
8.3.4 類選擇器 132
練習(xí)——創(chuàng)建ID選擇器和類選擇器 132
8.3.5 偽類和偽對象選擇器 135
練習(xí)——創(chuàng)建并應(yīng)用超鏈接偽類樣式 136
8.3.6 群組選擇器 137
8.3.7 派生選擇器 137
練習(xí)——在網(wǎng)頁中創(chuàng)建并應(yīng)用群組和派生CSS樣式 138
8.4 在網(wǎng)頁中應(yīng)用CSS樣式的4種方式 139
8.4.1 內(nèi)聯(lián)CSS樣式 139
8.4.2 內(nèi)部CSS樣式 140
8.4.3 外部CSS樣式 140
練習(xí)——創(chuàng)建并鏈接外部CSS樣式表文件 141
8.4.4 導(dǎo)入外部CSS樣式 143
8.5 CSS樣式的特性 144
8.5.1 CSS樣式的繼承性 144
8.5.2 CSS樣式的特殊性 144
8.5.3 CSS樣式的層疊性 145
8.5.4 CSS樣式的重要性 145
8.6 本章小結(jié) 145
8.7 課后習(xí)題 145
第9章 CSS布局 147
9.1 創(chuàng)建Div 147
9.1.1 了解Div 147
9.1.2 如何插入Div 148
9.1.3 塊元素與行內(nèi)元素 149
9.2 CSS盒模型 150
9.2.1 什么是CSS盒模型 150
9.2.2 CSS盒模型的特性 151
9.2.3 margin屬性——邊距 151
9.2.4 border屬性——邊框 151
9.2.5 padding屬性——填充 151
練習(xí)——設(shè)置網(wǎng)頁元素盒模型 152
9.3 網(wǎng)頁元素定位屬性 154
9.3.1 position屬性——元素定位 154
9.3.2 網(wǎng)頁元素相對定位 155
練習(xí)——實現(xiàn)網(wǎng)頁元素的疊加顯示 155
9.3.3 網(wǎng)頁元素絕對定位 156
練習(xí)——網(wǎng)頁元素固定在右側(cè)顯示 156
9.3.4 網(wǎng)頁元素固定定位 157
練習(xí)——實現(xiàn)固定位置的導(dǎo)航菜單 157
9.3.5 網(wǎng)頁元素浮動定位 159
練習(xí)——制作順序排列的圖像列表 159
9.4 網(wǎng)頁常用布局方式 161
9.4.1 居中的布局 162
9.4.2 浮動的布局 163
9.4.3 自適應(yīng)高度的解決方法 168
9.5 本章小結(jié) 169
9.6 課后習(xí)題 169
第10章 CSS樣式屬性詳解 170
10.1 使用CSS設(shè)置文字樣式 170
10.1.1 font-family屬性——字體 170
10.1.2 font-size屬性——字體大小 170
10.1.3 color屬性——字體顏色 171
練習(xí)——設(shè)置網(wǎng)頁文字基本效果 171
10.1.4 font-weight屬性——字體粗細(xì) 173
10.1.5 font-style屬性——字體樣式 173
練習(xí)——設(shè)置網(wǎng)頁文字的加粗和傾斜效果 174
10.1.6 text-transform屬性——英文字體大小寫 175
練習(xí)——設(shè)置網(wǎng)頁中英文字體大小寫 175
10.1.7 text-decoration屬性——文字修飾 177
練習(xí)——為網(wǎng)頁文字添加修飾 177
10.1.8 letter-spacing屬性——字符間距 178
練習(xí)——設(shè)置中文字符間距 179
10.2 使用CSS設(shè)置段落樣式 179
10.2.1 line-height屬性——行間距 179
10.2.2 text-indent屬性——段落首行縮進(jìn) 180
練習(xí)——美化網(wǎng)頁中的段落文本 180
10.2.3 text-align屬性——文本水平對齊 181
練習(xí)——設(shè)置文本水平對齊 181
10.2.4 vertical-align屬性——文本垂直對齊 183
練習(xí)——設(shè)置文本垂直對齊 183
10.3 使用CSS設(shè)置背景顏色和背景圖像 185
10.3.1 background-color屬性——背景顏色 185
10.3.2 background-image屬性——背景圖像 185
10.3.3 background-repeat屬性——背景圖像平鋪方式 185
練習(xí)——設(shè)置網(wǎng)頁背景效果 186
10.3.4 background-position屬性——背景圖像位置 188
練習(xí)——定位網(wǎng)頁中的背景圖像 188
10.3.5 background-attachment屬性——背景圖像固定 190
練習(xí)——固定網(wǎng)頁中的背景圖像 190
10.4 使用CSS設(shè)置列表樣式 191
10.4.1 list-style-type屬性——設(shè)置列表符號 191
練習(xí)——設(shè)置新聞列表效果 191
10.4.2 list-style-image屬性——自定義列表符號 192
練習(xí)——自定義新聞列表符號 192
10.4.3 設(shè)置定義列表 194
練習(xí)——制作復(fù)雜新聞列表 194
10.5 使用CSS設(shè)置邊框樣式 195
10.5.1 border-width屬性——邊框?qū)挾取?95
10.5.2 border-style屬性——邊框樣式 195
10.5.3 border-color屬性——邊框顏色 196
練習(xí)——為網(wǎng)頁元素添加邊框效果 196
10.6 超鏈接CSS樣式偽類 197
10.6.1 :link偽類 197
10.6.2 :hover偽類 198
10.6.3 :active偽類 198
10.6.4 :visited偽類 199
練習(xí)——設(shè)置網(wǎng)頁中超鏈接文字效果 199
10.6.5 按鈕式超鏈接 202
練習(xí)——制作網(wǎng)站導(dǎo)航菜單 202
10.7 cursor屬性——光標(biāo)指針效果 204
練習(xí)——在網(wǎng)頁中實現(xiàn)多種光標(biāo)指針效果 204
10.8 本章小結(jié) 206
10.9 課后習(xí)題 206
第11章 CSS3.0新增屬性詳解 207
11.1 了解CSS3.0 207
11.1.1 CSS3.0的發(fā)展 207
11.1.2 瀏覽器對CSS3.0的支持情況 207
11.1.3 了解CSS3.0的全新功能 208
11.2 CSS3.0顏色設(shè)置方式 208
11.2.1 RGBA顏色值 208
練習(xí)——使用RGBA設(shè)置半透明背景顏色 209
11.2.2 HSL和HSLA顏色值 209
練習(xí)——使用HSLA設(shè)置半透明背景顏色 210
11.2.3 transparent顏色值 211
11.3 CSS3.0新增文字設(shè)置屬性 211
11.3.1 text-overflow屬性——文本溢出處理 211
練習(xí)——設(shè)置網(wǎng)頁中溢出文本的處理方式 212
11.3.2 word-wrap和word-break屬性——控制文本換行 213
練習(xí)——控制英文內(nèi)容強(qiáng)制換行 213
11.3.3 text-shadow屬性——文本陰影 214
練習(xí)——為網(wǎng)頁文本添加陰影效果 215
11.3.4 @font-face規(guī)則——使用服務(wù)器端字體 215
練習(xí)——在網(wǎng)頁中使用特殊字體 216
11.4 CSS3.0新增背景設(shè)置屬性 217
11.4.1 線性漸變背景顏色 217
練習(xí)——為網(wǎng)頁設(shè)置線性漸變背景顏色 218
11.4.2 徑向漸變背景顏色 220
練習(xí)——為網(wǎng)頁設(shè)置徑向漸變背景顏色 221
11.4.3 background屬性——設(shè)置多背景圖像 222
練習(xí)——為網(wǎng)頁設(shè)置多個背景圖像 222
11.4.4 background-size屬性——背景圖像大小 223
練習(xí)——控制網(wǎng)頁背景圖像的大小 223
11.4.5 background-origin屬性——背景圖像原點 225
練習(xí)——控制背景圖像開始顯示的原點位置 226
11.4.6 background-clip屬性——背景圖像顯示區(qū)域 226
練習(xí)——控制背景圖像的顯示區(qū)域 227
11.5 CSS3.0新增邊框設(shè)置屬性 228
11.5.1 border-colors屬性——多重邊框顏色 228
練習(xí)——實現(xiàn)網(wǎng)頁元素多色彩邊框效果 228
11.5.2 border-image屬性——圖像邊框 229
練習(xí)——為網(wǎng)頁元素添加圖像邊框效果 230
11.5.3 border-radius屬性——圓角邊框 231
練習(xí)——在網(wǎng)頁中實現(xiàn)圓角邊框效果 231
11.6 CSS3.0新增多列布局屬性 233
11.6.1 columns屬性——多列布局 233
練習(xí)——將網(wǎng)頁內(nèi)容分為多列 233
11.6.2 column-width屬性——列寬度 234
11.6.3 column-count屬性——列數(shù) 234
11.6.4 column-gap屬性——列間距 234
11.6.5 column-rule屬性——列分隔線 235
11.6.6 column-span屬性——橫跨所有列 235
練習(xí)——實現(xiàn)網(wǎng)頁內(nèi)容的分欄顯示效果 235
11.7 CSS3.0新增其他屬性 237
11.7.1 opaity屬性——元素不透明度 237
練習(xí)——設(shè)置網(wǎng)頁元素的半透明效果 238
11.7.2 box-shadow屬性——元素陰影 239
練習(xí)——為網(wǎng)頁元素添加陰影效果 239
11.7.3 resize屬性——改變元素尺寸 240
練習(xí)——實現(xiàn)網(wǎng)頁元素尺寸任意縮放 241
11.7.4 outline屬性——輪廓外邊框 242
練習(xí)——為網(wǎng)頁元素添加輪廓外邊框 243
11.7.5 appearance屬性——偽裝的元素 244
練習(xí)——將超鏈接文字偽裝成按鈕 245
11.7.6 content屬性——為元素賦予內(nèi)容 246
練習(xí)——為網(wǎng)頁元素賦予文字內(nèi)容 246
11.8 本章小結(jié) 247
11.9 課后習(xí)題 247
第12章 使用CSS3.0實現(xiàn)動畫效果 248
12.1 實現(xiàn)元素變形 248
12.1.1 transform屬性 248
12.1.2 使用rotate()函數(shù)實現(xiàn)元素旋轉(zhuǎn) 248
練習(xí)——實現(xiàn)網(wǎng)頁元素的旋轉(zhuǎn)變形效果 249
12.1.3 使用scale()函數(shù)實現(xiàn)元素縮放和翻轉(zhuǎn)變形 250
練習(xí)——實現(xiàn)網(wǎng)頁元素的縮放和翻轉(zhuǎn)效果 250
12.1.4 使用translate()函數(shù)實現(xiàn)元素移動 251
練習(xí)——實現(xiàn)網(wǎng)頁元素的移動效果 251
12.1.5 使用skew()函數(shù)實現(xiàn)元素傾斜 253
練習(xí)——實現(xiàn)網(wǎng)頁元素的傾斜效果 253
12.1.6 使用matrix()函數(shù)實現(xiàn)元素矩陣變形 254
練習(xí)——實現(xiàn)網(wǎng)頁元素的矩陣變形效果 254
12.1.7 定義變形中心點 255
練習(xí)——設(shè)置網(wǎng)頁元素的變形中心點 256
12.1.8 同時使用多個變形函數(shù) 257
練習(xí)——為網(wǎng)頁元素同時應(yīng)用多個變形效果 257
12.2 CSS3.0實現(xiàn)過渡動畫效果 258
12.2.1 transition屬性 258
12.2.2 transition-property屬性——實現(xiàn)過渡效果 259
練習(xí)——實現(xiàn)網(wǎng)頁元素旋轉(zhuǎn)并放大動畫 259
12.2.3 transition-duration屬性——設(shè)置過渡時間 260
練習(xí)——設(shè)置網(wǎng)頁元素變形動畫持續(xù)時間 260
12.2.4 transition-delay屬性——實現(xiàn)過渡延遲效果 262
練習(xí)——設(shè)置網(wǎng)頁元素變形動畫延遲時間 262
12.2.5 transition-timing-function屬性——設(shè)置過渡方式 263
練習(xí)——設(shè)置網(wǎng)頁元素變形動畫過渡方式 263
12.3 本章小結(jié) 264
12.4 課后習(xí)題 264
第三篇 jQuery Mobile頁面
第13章 初識jQuery Mobile 266
13.1 jQuery入門 266
13.1.1 什么是jQuery 266
13.1.2 如何引用jQuery函數(shù)庫 267
13.1.3 jQuery基本語法 267
13.1.4 jQuery選擇器 268
13.1.5 使用jQuery設(shè)置CSS樣式屬性 269
練習(xí)——使用jQuery改變CSS樣式效果 269
13.2 jQuery Mobile基礎(chǔ) 270
13.2.1 什么是jQuery Mobile 270
13.2.2 jQuery Mobile的優(yōu)勢 271
13.3 jQuery Mobile頁面開發(fā)前的準(zhǔn)備工作 271
13.3.1 如何測試所制作的移動頁面 271
13.3.2 加載jQuery Mobile函數(shù)庫文件 273
13.4 認(rèn)識jQuery Mobile頁面結(jié)構(gòu) 274
13.4.1 創(chuàng)建jQuery Mobile頁面 274
練習(xí)——創(chuàng)建jQuery Mobile頁面 274
13.4.2 jQuery Mobile頁面的基本架構(gòu) 276
13.4.3 多容器jQuery Mobile頁面 277
13.5 jQuery Mobile頁面的基本操作 277
13.5.1 jQuery Mobile頁面中多容器之間的鏈接 277
練習(xí)——創(chuàng)建jQuery Mobile頁面多容器之間鏈接 278
13.5.2 鏈接外部jQuery Mobile頁面 280
練習(xí)——鏈接外部jQuery Mobile頁面 280
13.5.3 預(yù)加載jQuery Mobile頁面 282
13.5.4 頁面緩存 282
練習(xí)——在jQuery Mobile頁面中實現(xiàn)預(yù)加載和緩存 283
13.5.5 在jQuery Mobile頁面中實現(xiàn)后退功能 283
練習(xí)——在jQuery Mobile頁面中實現(xiàn)后退功能 284
13.5.6 彈出對話框 285
練習(xí)——以彈出窗口方式顯示鏈接內(nèi)容 285
13.6 本章小結(jié) 287
13.7 課后習(xí)題 287
第14章 jQuery Mobile頁面詳解 288
14.1 頭部欄 288
14.1.1 頭部欄的基本結(jié)構(gòu) 288
14.1.2 設(shè)置后退按鈕的文字 289
14.1.3 添加按鈕 290
練習(xí)——在jQuery Mobile頁面頭部欄中添加按鈕 290
14.1.4 設(shè)置按鈕位置 293
14.2 導(dǎo)航欄 294
14.2.1 導(dǎo)航欄的基本結(jié)構(gòu) 295
練習(xí)——在jQuery Mobile頁面中創(chuàng)建導(dǎo)航欄 295
14.2.2 導(dǎo)航欄的圖標(biāo) 297
14.2.3 設(shè)置導(dǎo)航欄圖標(biāo)位置 299
14.3 尾部欄 300
14.3.1 添加按鈕 300
練習(xí)——在jQuery Mobile頁面尾部欄中添加按鈕 300
14.3.2 添加表單元素 301
練習(xí)——在jQuery Mobile頁面尾部欄中添加下拉列表 302
14.4 jQuery Mobile頁面正文內(nèi)容處理 303
14.4.1 jQuery Mobile布局網(wǎng)格 303
練習(xí)——創(chuàng)建布局網(wǎng)格 303
14.4.2 可折疊區(qū)塊 305
練習(xí)——創(chuàng)建可折疊內(nèi)容 306
14.4.3 嵌套可折疊區(qū)塊 307
14.4.4 可折疊區(qū)塊組 308
練習(xí)——創(chuàng)建可折疊區(qū)塊組 308
14.5 本章小結(jié) 309
14.6 課后習(xí)題 309
第15章 使用jQuery Mobile頁面組件和主題 311
15.1 列表組件 311
15.1.1 無序列表 311
練習(xí)——在jQuery Mobile頁面中創(chuàng)建列表 311
15.1.2 有序列表 312
15.1.3 分割列表選項 313
練習(xí)——分割jQuery Mobile頁面中的列表選項 313
15.1.4 列表選項分組 315
練習(xí)——實現(xiàn)列表選項的分組 315
15.1.5 開啟或禁用列表項中的圖標(biāo) 317
練習(xí)——開啟或禁用列表項中的圖標(biāo) 317
15.1.6 圖標(biāo)與計數(shù)器 319
練習(xí)——為列表項添加圖標(biāo)和計數(shù)器 319
15.1.7 列表項內(nèi)容格式化處理 320
練習(xí)——列表項內(nèi)容的格式化處理 321
15.2 按鈕組件 323
15.2.1 使用按鈕組件 323
練習(xí)——在jQuery Mobile頁面中添加按鈕 323
15.2.2 使用按鈕組 325
練習(xí)——在jQuery Mobile頁面中使用按鈕組 325
15.3 表單組件 326
15.3.1 文本輸入框 326
練習(xí)——在jQuery Mobile頁面添加不同類型輸入框 326
15.3.2 滑塊 327
練習(xí)——使用滑塊修改頁面元素的背景顏色 327
15.3.3 翻轉(zhuǎn)切換開關(guān) 328
15.3.4 單選按鈕 328
練習(xí)——制作投票表單 329
15.3.5 復(fù)選框 330
練習(xí)——制作調(diào)查表單 330
15.3.6 選擇菜單 331
15.3.7 多項選擇菜單 333
15.4 關(guān)于jQuery Mobile頁面主題 334
15.4.1 什么是jQuery Mobile頁面主題 334
15.4.2 jQuery Mobile頁面主題的特點 334
15.4.3 默認(rèn)的jQuery Mobile頁面主題 335
練習(xí)——應(yīng)用jQuery Mobile頁面的默認(rèn)主題 335
15.4.4 如何修改默認(rèn)的jQuery Mobile頁面主題 336
練習(xí)——修改jQuery Mobile頁面的默認(rèn)效果 336
15.5 自定義jQuery Mobile頁面主題 338
15.5.1 自定義jQuery Mobile頁面背景 338
練習(xí)——自定義jQuery Mobile頁面背景 338
15.5.2 自定義jQuery Mobile頁面工具欄 341
練習(xí)——自定義jQuery Mobile頁面工具欄 341
15.5.3 自定義jQuery Mobile頁面內(nèi)容區(qū)域 343
練習(xí)——自定義可折疊區(qū)塊主題 344
15.6 本章小結(jié) 345
15.7 課后習(xí)題 345
第16章 使用jQuery Mobile頁面事件 346
16.1 應(yīng)用jQuery Mobile事件 346
16.1.1 頁面顯示/隱藏事件 346
16.1.2 加載外部頁面事件 347
16.1.3 頁面切換事件 347
練習(xí)——設(shè)置jQuery Mobile頁面切換過渡動畫效果 348
16.1.4 觸摸事件 350
練習(xí)——使用觸摸事件實現(xiàn)滑動屏幕瀏覽圖片 351
16.1.5 滾動屏幕事件 354
練習(xí)——使用滾動屏幕事件改變元素的背景顏色 354
16.1.6 屏幕翻轉(zhuǎn)事件 357
練習(xí)——通過屏幕翻轉(zhuǎn)事件判斷移動設(shè)備方向 357
16.2 jQuery Mobile頁面的設(shè)置技巧 361
16.2.1 固定頁面頭部欄與尾部欄 361
練習(xí)——固定jQuery Mobile頁面中頭部欄和尾部欄的位置 361
16.2.2 隨機(jī)顯示頁面背景 362
練習(xí)——隨機(jī)顯示jQuery Mobile頁面的背景圖片 362
16.3 本章小結(jié) 366
16.4 課后習(xí)題 366
第17章 移動端應(yīng)用開發(fā)實戰(zhàn) 367
17.1 移動APP引導(dǎo)頁面 367
17.1.1 功能分析 367
17.1.2 制作步驟 368
練習(xí)——制作移動APP引導(dǎo)頁面 368
17.2 電商APP頁面 374
17.2.1 功能分析 374
17.2.2 制作電商APP頁面 375
練習(xí)——制作電商APP頁面 375
17.2.3 制作側(cè)邊導(dǎo)航菜單 381
練習(xí)——制作側(cè)邊導(dǎo)航菜單 381
17.3 可滑動操作的移動頁面 386
17.3.1 功能分析 386
17.3.2 制作可滑動切換的背景 386
練習(xí)——制作可滑動切換的背景 386
17.3.3 制作可滑動底部導(dǎo)航欄 389
練習(xí)——制作可滑動底部導(dǎo)航欄 389
17.4 本章小結(jié) 393
17.5 課后習(xí)題 393
</div>
</div>
<div id="gvpvavb" class="clear"></div>
<script type="text/javascript">
function tab(a,b,c)
{
for(i=1;i<=b;i++){
if(c==i)
{
// 判斷選擇模塊
document.getElementById(a+"_mo_"+i).style.display = "block"; // 顯示模塊內(nèi)容
document.getElementById(a+"_to_"+i).className = "no"; // 改變菜單為選中樣式
}
else{
// 沒有選擇的模塊
document.getElementById(a+"_mo_"+i).style.display = "none"; // 隱藏沒有選擇的模塊
document.getElementById(a+"_to_"+i).className = "q"; // 清空沒有選擇的菜單樣式
}
}
}
</script>
<div id="etywfwm" class="b-comment">
<div id="seylbsq" class="mt">
<span> 你還可能感興趣</span>
</div>
</div>
<div id="ogliceu" class="d-comment">
<ul>
<li><a href="bookshow.asp?id=2451438" target="_blank"><img src="/uploadfile/202210/9787302611318.jpg" alt="精通C++語言" name="Pic" onerror="showImgDelay(this,'/uploadfile/202210/9787302611318.jpg',2);" width="148" height="148"></a><br><a href="bookshow.asp?id=2451438" title="精通C++語言" target="_blank">精通C++語言</a></li><li><a href="bookshow.asp?id=2212465" target="_blank"><img src="/uploadfile/202112/9787115564771.jpg" alt="C/C++程序設(shè)計教程" name="Pic" onerror="showImgDelay(this,'/uploadfile/202112/9787115564771.jpg',2);" width="148" height="148"></a><br><a href="bookshow.asp?id=2212465" title="C/C++程序設(shè)計教程" target="_blank">C/C++程序設(shè)計教程</a></li><li><a href="bookshow.asp?id=2776409" target="_blank"><img src="/uploadfile/202408/9787302670223.jpg" alt="Python程序設(shè)計基礎(chǔ)教程" name="Pic" onerror="showImgDelay(this,'/uploadfile/202408/9787302670223.jpg',2);" width="148" height="148"></a><br><a href="bookshow.asp?id=2776409" title="Python程序設(shè)計基礎(chǔ)教程" target="_blank">Python程序設(shè)計基礎(chǔ)教程</a></li><li><a href="bookshow.asp?id=1283225" target="_blank"><img src="/uploadfile/Download/20180309124664776477.jpg" alt="C語言上機(jī)實驗指導(dǎo)（第2版）" name="Pic" onerror="showImgDelay(this,'/uploadfile/Download/20180309124664776477.jpg',2);" width="148" height="148"></a><br><a href="bookshow.asp?id=1283225" title="C語言上機(jī)實驗指導(dǎo)（第2版）" target="_blank">C語言上機(jī)實驗指導(dǎo)（第2版）</a></li><li><a href="bookshow.asp?id=2700274" target="_blank"><img src="/uploadfile/202407/9787302658207.jpg" alt="Java語言程序設(shè)計上機(jī)實驗" name="Pic" onerror="showImgDelay(this,'/uploadfile/202407/9787302658207.jpg',2);" width="148" height="148"></a><br><a href="bookshow.asp?id=2700274" title="Java語言程序設(shè)計上機(jī)實驗" target="_blank">Java語言程序設(shè)計上機(jī)實驗</a></li>
</ul>
</div>
<div id="bamhqwj" class="b-comment">
<div id="blupxdc" class="mt">
<span> 我要評論</span>
</div>
</div>
<div id="alqvmkl" class="c-comment">
<form method="post" name="comment" action="/book_comment.asp">
<table border="0" cellspacing="1" cellpadding="3" class="commentlist">
<input name=id type=hidden value="1446874">
<input name=title type=hidden value="HTML5+CSS3+jQuery Mobile移動網(wǎng)站與App開發(fā)實戰(zhàn)（視頻講解版）">
<tr>
<th>您的姓名</th>
<td><input type="text" name="name" size="20" maxlength="20" class="form" /> 驗證碼：<input name="verifycode" type="text" size="7" style=" height:18px;" /> <img src="safecode.asp?" onClick="this.src+=Math.random()" alt="圖片看不清？點擊重新得到驗證碼" style="cursor:hand;" height="18" /></td>
</tr>
<tr>
<th>留言內(nèi)容</th>
<td><textarea name="content" id="content" cols="46" rows="3" class="form-textarea" wrap=physical onKeyDown="checkMaxInput(this.form)" onKeyUp="checkMaxInput(this.form)" style="overflow:auto"></textarea></td>
</tr>
<tr>
<td colspan="2"><input type="submit" value=" 發(fā)表評論 " name="cmdok" class="button" /><input type="hidden" name="do" value="save" /></td>
</tr>
</table>
</form>
</div>
<!---div class="b-comment_fenlei">
<ul>
</ul>
</div--->
</div>
</td>
</tr>
</table>
<div class="zeylsgm" id="footer">
<div id="ycsmzpy" class="end_list"><a href="aboutus.asp" title="">公司介紹</a><a href="Honor.asp" title="">榮譽(yù)資質(zhì)</a><a href="/zxbooks.asp" title="">定向推薦書目</a><a href="cbssq.asp" title="">出版社授權(quán)</a><a href="/cbs_dc.asp" title=""><strong><font color="#f8e81f">采訪數(shù)據(jù)下載(EXCEL格式)</font></strong></a><a title=""><strong><font color="#f8e81f">采訪數(shù)據(jù)下載(ISO格式)</font></strong></a><a href="/myadmin/login.asp" title="" target="_blank">出版社登錄</a><a href="lxwm.asp" target="_blank" title="">聯(lián)系我們</a></div>
<div id="yjxvjzt" class="copyright_n">
Copyright 1993-2024 <a >www.wsgph.com</a> Inc.All Rights Reserved<br>
技術(shù)支持：山東中教產(chǎn)業(yè)發(fā)展股份有限公司 客服電話：400-0531-123<script type="text/javascript">
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "#/h.js%3F34a0559de8bca702f061988709fd9a88' type='text/javascript'%3E%3C/script%3E"));
</script>
</div>
<div id="wmweukq" class="ban_img"><img src="images/ban_img_zj.png" width="691" height="55"></div>
</div>
</body>
</html>
<footer>
<div class="friendship-link">
<p>感谢您访问我们的网站，您可能还对以下资源感兴趣：</p>
<a href="http://m.dlnsoft.cn/" title="Av在线播放五月天">Av在线播放五月天</a>
<div class="friend-links">
</div>
</div>
</footer>
<script>
(function(){
var bp = document.createElement('script');
var curProtocol = window.location.protocol.split(':')[0];
if (curProtocol === 'https') {
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
}
else {
bp.src = 'http://push.zhanzhang.baidu.com/push.js';
}
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(bp, s);
})();
</script>
</body><div id="kidxd" class="pl_css_ganrao" style="display: none;"><bdo id="kidxd"></bdo><wbr id="kidxd"><th id="kidxd"></th></wbr><thead id="kidxd"><strong id="kidxd"><tt id="kidxd"></tt></strong></thead><th id="kidxd"></th><u id="kidxd"><delect id="kidxd"><sup id="kidxd"></sup></delect></u><pre id="kidxd"></pre><optgroup id="kidxd"><ul id="kidxd"></ul></optgroup><u id="kidxd"></u><pre id="kidxd"></pre><sup id="kidxd"></sup><strike id="kidxd"><form id="kidxd"><sub id="kidxd"><big id="kidxd"></big></sub></form></strike><option id="kidxd"><tr id="kidxd"><label id="kidxd"></label></tr></option><tbody id="kidxd"><strong id="kidxd"><tt id="kidxd"><acronym id="kidxd"></acronym></tt></strong></tbody><pre id="kidxd"><pre id="kidxd"><center id="kidxd"><legend id="kidxd"></legend></center></pre></pre><s id="kidxd"><label id="kidxd"></label></s><menu id="kidxd"></menu><font id="kidxd"><cite id="kidxd"></cite></font><strong id="kidxd"></strong><abbr id="kidxd"><progress id="kidxd"><legend id="kidxd"></legend></progress></abbr><sup id="kidxd"><table id="kidxd"><meter id="kidxd"></meter></table></sup><kbd id="kidxd"></kbd><delect id="kidxd"></delect><strong id="kidxd"></strong><th id="kidxd"><acronym id="kidxd"><p id="kidxd"><samp id="kidxd"></samp></p></acronym></th><code id="kidxd"><track id="kidxd"><dl id="kidxd"><listing id="kidxd"></listing></dl></track></code><output id="kidxd"><rt id="kidxd"></rt></output><legend id="kidxd"><abbr id="kidxd"><pre id="kidxd"></pre></abbr></legend><dd id="kidxd"><tbody id="kidxd"></tbody></dd><sub id="kidxd"></sub><li id="kidxd"></li><div id="kidxd"><strong id="kidxd"><abbr id="kidxd"></abbr></strong></div><small id="kidxd"></small><progress id="kidxd"><nav id="kidxd"><acronym id="kidxd"></acronym></nav></progress><meter id="kidxd"><li id="kidxd"><form id="kidxd"><label id="kidxd"></label></form></li></meter><dl id="kidxd"></dl><ins id="kidxd"></ins><optgroup id="kidxd"></optgroup><legend id="kidxd"><label id="kidxd"><pre id="kidxd"></pre></label></legend><meter id="kidxd"><menu id="kidxd"></menu></meter><xmp id="kidxd"><var id="kidxd"></var></xmp><pre id="kidxd"><pre id="kidxd"></pre></pre><output id="kidxd"><thead id="kidxd"><noframes id="kidxd"></noframes></thead></output><tbody id="kidxd"><sub id="kidxd"><ol id="kidxd"></ol></sub></tbody><xmp id="kidxd"><var id="kidxd"></var></xmp><b id="kidxd"><legend id="kidxd"></legend></b><em id="kidxd"></em><tr id="kidxd"></tr><sup id="kidxd"></sup><output id="kidxd"></output><em id="kidxd"><table id="kidxd"></table></em></div></html>
書單推薦
