響應式網頁程序設計HTML5、CSS3、JavaScript、jQuery、jQuery

陳惠貞

響應式網頁程序設計HTML5、CSS3、JavaScript、jQuery、jQuery 預覽內頁
  • 響應式網頁程序設計HTML5、CSS3、JavaScript、jQuery、jQuery-preview-1
  • 響應式網頁程序設計HTML5、CSS3、JavaScript、jQuery、jQuery-preview-2
  • 響應式網頁程序設計HTML5、CSS3、JavaScript、jQuery、jQuery-preview-3
響應式網頁程序設計HTML5、CSS3、JavaScript、jQuery、jQuery-preview-1

買這商品的人也買了...

商品描述

本書是快速學會網頁程序設計關鍵技術的經典暢銷書的第5次全新改版升級，書中通過豐富的案例循序漸進地講解網頁程序設計的語法與應用。 全書內容共分4篇。HTML 5篇涵蓋多種元素與API應用，特別是以更新版的HTML 5.2來開發各種網頁應用程序；CSS 3篇講述如何定義網頁的外觀，包括編排、顯示、格式化及設置特殊效果；JavaScript篇介紹JavaScript的核心語法及在瀏覽器端的應用；其他技術篇介紹熱門的jQuery、jQuery UI、Ajax技術，使網頁設計更快捷、更專業、更美觀靈動，而響應式網頁設計是根據用戶的瀏覽器環境自動調整網頁的版面配置，以提供更佳的效果。 本書由淺入深，範例導向實用，適合從零開始設計網頁的讀者閱讀，也適合作為高等院校相關專業和職業教育、培訓學校的教材和輔導用書。

作者簡介

陳惠貞，台灣IT暢銷書作家，出版多部作品，包括《PHP7 & MySQL跨設備網站開發》《PHP&MySQL跨設備網站開發實例精粹》《網頁程序設計HTML、JavaScript、CSS、XHTML、Ajax（第三版）》《網頁程序設計HTML5、JavaScript、CSS、XHTML、Ajax（第4版）》。

目錄大綱

目    錄
第1章  網頁設計簡介 1
1-1  網頁設計的流程 1
1-1-1  階段一：收集資料與規劃網站架構 1
1-1-2  階段二：網頁製作與測試 2
1-1-3  階段三：網站上傳與推廣 3
1-1-4  階段四：網站更新與維護 5
1-2  網頁設計相關的程序設計語言 5
1-3  HTML的發展 6
1-4  HTML 5文件的編寫方式 7
1-4-1  HTML 5文件的編輯工具 7
1-4-2  HTML 5文件的基本語法 9
1-4-3  編寫第一份HTML 5文件 12
第2章  文件結構 15
2-1  HTML文件的根元素——<html>元素 15
2-2  HTML文件的標頭—— <head>元素 16
2-2-1  <title>元素（文件標題） 16
2-2-2  <meta>元素（文件相關信息） 17
2-2-3  <link>元素（文件之間的關聯） 17
2-2-4  <style>元素（嵌入CSS樣式表） 18
2-3  HTML文件的主體——<body>元素 19
2-3-1  <h1> ~ <h6>元素（標題1 ~ 6） 21
2-3-2  <p>元素（段落） 22
2-3-3  <div>元素（組成一個區段） 23
2-3-4  <!-- -->元素（註釋） 24
2-4  HTML 5新增的結構元素 25
2-4-1  <article>（文章） 26
2-4-2  <section>（通用的區段） 27
2-4-3  <nav>元素（導航欄） 28
2-4-4  <header>與<footer>元素（頁首/頁尾） 29
2-4-5  <aside>元素（側邊欄） 29
2-4-6  <main>元素（主要內容） 30

第3章  數據編輯與格式化 32
3-1  區段格式 32
3-1-1  <pre>元素（預先格式化的區塊） 32
3-1-2  <blockquote>元素（左右縮排的區塊） 33
3-1-3  <address>元素（聯絡信息） 33
3-1-4  <hr>元素（水平線） 34
3-2  文字格式 35
3-2-1  設置文字格式的元素 35
3-2-2  <br>元素（換行） 36
3-2-3  <span>元素（組成一行） 37
3-2-4  <time>元素（日期時間） 38
3-3  插入或刪除數據——<ins>、<del>元素 39
3-4  項目符號與編號——<ul>、<ol>、<li>元素 39
3-5  定義列表——<dl>、<dt>、<dd>元素 42
3-6  超鏈接 42
3-6-1  絕對URL與相對URL 43
3-6-2  標記超鏈接—— <a>元素 44
3-6-3  在新索引標簽頁面中打開超鏈接 46
3-6-4  頁內超鏈接 47
3-7  設置相對URL的路徑信息——<base>元素 48

第4章  圖片 50
4-1  嵌入圖片——<img>元素 50
4-1-1  圖片的高度與寬度 51
4-1-2  圖片的替代顯示文字 51
4-2  標註——<figure>、<figcaption>元素 52
4-3  建立表格——<table>、<tr>、<td>、<th>元素 53
4-3-1  跨行合並單元格 56
4-3-2  跨列合並單元格 57
4-4  表格標題——<caption>元素 58
4-5  表格的表頭、主體與表尾——<thead>、<tbody>、<tfoot>元素 58
4-6  直列式表格——<colgroup>、<col>元素 61

第5章  影音多媒體 64
5-1  嵌入視頻——<video>元素 64
5-2  嵌入音頻——<audio>元素 66
5-3  嵌入對象——<object>元素 67
5-3-1  嵌入視頻 67
5-3-2  嵌入音頻 68
5-4  嵌入Scripting——<script>、<noscript>元素 68
5-5  嵌入浮動框架——<iframe>元素 70
5-5-1  嵌入優酷視頻 71
5-5-2  嵌入百度地圖 73
5-6  網頁自動導向 73

第6章  窗體 75
6-1  建立窗體——<form>、<input>元素 75
6-2  HTML 4.01提供的輸入類型 77
6-2-1  提交與重置按鈕（submit和reset） 78
6-2-2  單行文本框 79
6-2-3  單選按鈕 80
6-2-4  復選框 80
6-2-5  多行文本框 81
6-2-6  下拉式菜單（<select>、<option>） 83
6-2-7  密碼字段 85
6-2-8  隱藏字段 86
6-3  HTML 5新增的輸入類型 86
6-3-1  E-Mail類型 86
6-3-2  URL類型 87
6-3-3  search類型 87
6-3-4  number類型 88
6-3-5  range類型 88
6-3-6  color類型 89
6-3-7  tel類型 90
6-3-8  日期時間類（date、time、datetime、month、week、datetime-local） 90
6-4  按鈕——<button>元素 92
6-5  標簽文字——<label>元素 92
6-6  分組——<optgroup>元素 93
6-7  將窗體字段框起來——<fieldset>、<legend>元素 94

第7章  CSS基本語法 96
7-1  CSS的演進 96
7-2  CSS樣式表 97
7-3  鏈接HTML文件與CSS樣式表 100
7-3-1  在<head>元素裡面使用<style>元素嵌入樣式表 100
7-3-2  使用HTML元素的style屬性設置樣式表 101
7-3-3  將外部的樣式表導入HTML文件 101
7-3-4  將外部的樣式表鏈接至HTML文件 102
7-4  選擇器的類型 102
7-4-1  萬用選擇器 102
7-4-2  類型選擇器 102
7-4-3  子選擇器 103
7-4-4  後裔選擇器 103
7-4-5  相鄰兄弟選擇器 103
7-4-6  全體兄弟選擇器 103
7-4-7  類選擇器 103
7-4-8  ID選擇器 104
7-4-9  屬性選擇器 105
7-4-10  偽元素 108
7-4-11  偽類 108
7-5  樣式表的層疊順序 110

第8章  顏色、字體、文本與列表屬性 112
8-1  顏色屬性 112
8-1-1  color（前景顏色） 112
8-1-2  background-color（背景顏色） 114
8-1-3  opacity（透明度） 115
8-2  字體屬性 115
8-2-1  font-family（文字字體） 115
8-2-2  font-size（字體大小） 116
8-2-3  font-style（字體樣式） 118
8-2-4  font-weight（字體粗細） 119
8-2-5  font-variant（字體變化） 120
8-2-6  line-height（行高） 120
8-2-7  font（字體屬性簡便表示法） 121
8-3  文本屬性 122
8-3-1  text-indent（首行縮排） 122
8-3-2  text-align（文本對齊方式） 122
8-3-3  letter-spacing（字母間距） 123
8-3-4  word-spacing（單詞間距） 124
8-3-5  text-transform（大小寫轉換方式） 124
8-3-6  white-space（空格符） 125
8-3-7  text-shadow（文本陰影） 126
8-3-8  text-decoration-line、text-decoration-style、text-decoration-color
（文本裝飾線、樣式與顏色） 127
8-3-9  text-decoration（文本強調標記） 128
8-4  列表屬性 128
8-4-1  list-style-type（項目符號與編號類型） 128
8-4-2  list-style-image（圖片項目符號） 131
8-4-3  list-style-position（項目符號與編號的位置） 131
8-4-4  list-style（列表屬性的簡便表示法） 133

第9章  Box Model與定位方式 134
9-1  Box Model 134
9-2  邊界屬性 136
9-3  留白屬性 137
9-4  框線屬性 139
9-4-1  border-style（框線樣式） 139
9-4-2  border-color（框線顏色） 140
9-4-3  border-width（框線寬度） 141
9-4-4  border（框線屬性的簡便表示法） 143
9-4-5  border-radius（框線圓角） 144
9-5  寬度與高度屬性 145
9-5-1  width、height（寬度、高度） 145
9-5-2  min-width、max-width（最小寬度與最大寬度） 145
9-5-3  min-height、max-height（最小高度與最大高度） 146
9-5-4  overflow（顯示或隱藏溢出的內容） 147
9-6  定位方式 148
9-6-1  display（HTML元素的顯示層級） 148
9-6-2  top、right、bottom、left（上右下左位移量） 149
9-6-3  position（Box的定位方式） 150
9-6-4  float、clear（設置圖旁配字、解除圖旁配字） 155
9-6-5  z-index（重疊順序） 157
9-6-6  visibility（顯示或隱藏Box） 158
9-6-7  box-shadow（Box陰影） 159
9-6-8  vertical-align（垂直對齊） 160

第10章  背景、漸層與表格 163
10-1  背景屬性 163
10-1-1  background-image（背景圖片） 163
10-1-2  background-repeat（背景圖片重復排列方式） 166
10-1-3  background-position（背景圖片起始位置） 168
10-1-4  background-attachment（背景圖片是否隨內容滾動） 171
10-1-5  background-clip（背景顯示區域） 173
10-1-6  background-origin（背景顯示位置基準點） 174
10-1-7  background-size（背景圖片大小） 175
10-1-8  background（背景屬性的簡便表示法） 176
10-2  漸變屬性 177
10-2-1  linear-gradient()（線性漸變） 177
10-2-2  radial-gradient()（放射狀漸變） 178
10-2-3  repeating-linear-gradient()、repeating-radial-gradient()（重復漸變） 179
10-3  表格屬性 179
10-3-1  caption-side（表格標題位置） 179
10-3-2  border-collap

se（表格框線模式） 180
10-3-3  table-layout（表格版面編排方式） 182
10-3-4  empty-cells（顯示或隱藏空白單元格） 182
10-3-5  border-spacing（表格框線間距） 183

第11章  變形、轉場與媒體查詢 185
11-1  變形處理 185
11-1-1  transform（2D、3D變形處理） 185
11-1-2  transform-origin（變形處理的原點） 188
11-2  轉場效果 189
11-3  媒體查詢 191

第12章  JavaScript的基本語法 194
12-1  編寫第一個JavaScript程序 194
12-1-1  方式一：嵌入JavaScript程序 194
12-1-2  方式二：使用JavaScript事件處理程序 196
12-1-3  方式三：加載外部的JavaScript程序 196
12-2  JavaScript程序代碼編寫慣例 197
12-3  類型 199
12-3-1  數值 200
12-3-2  字符串 200
12-3-3  布爾 201
12-3-4  undefined 201
12-3-5  null 201
12-4  變量 201
12-5  常數 202
12-6  運算符 203
12-6-1  算術運算符 203
12-6-2  字符串運算符 204
12-6-3  遞增/遞減運算符 204
12-6-4  比較運算符 204
16-6-5  邏輯運算符 205
12-6-6  位運算符 206
12-6-7  賦值運算符 207
12-6-8  條件運算符 207
12-6-9  類型運算符 207
12-6-10  運算符的優先級 208
12-7  流程控制 208
12-7-1  if 209
12-7-2  switch 213
12-7-3  for 214
12-7-4  while 216
12-7-5  do...while 217
12-7-6  for...in 219
12-7-7  break與continue 220
12-8 函數 221
12-8-1  用戶自定義函數 221
12-8-2  函數的參數 224
12-8-3  函數的返回值 225
12-9  變量的作用域 225
12-9-1  全局變量 226
12-9-2  局部變量 226

第13章  對象 229
13-1  認識對象 229
13-2  window對象 231
13-3  標準內部對象 235
13-3-1  Number對象 235
13-3-2  Boolean對象 237
13-3-3  String對象 237
13-3-4  Function對象 240
13-3-5  Object對象 240
13-3-6  Math對象 240
13-3-7  Date對象 242
13-3-8  Array對象 245
13-3-9  Error對象 254
13-4  環境對象 256
13-4-1  location對象 257
13-4-2  navigator對象 258
13-4-3  screen對象 260
13-4-4  history對象 261
13-5  document對象 261
13-5-1  DOM（文件對像模型） 262
13-5-2  document對象的屬性與方法 262
13-5-3  document對象的子對象與集合 266
13-6  element對象 267

第14章  事件處理 270
14-1  事件驅動模式 270
14-2  事件的類型 271
14-2-1  傳統的事件 271
14-2-2  HTML 5事件 272
14-2-3  DOM事件 272
14-2-4  觸控事件 272
14-3  事件處理程序 272
14-4  JavaScript實用範例 277
14-4-1  打印網頁 277
14-4-2  網頁跑馬燈 277
14-4-3  具有超鏈接功能的下拉菜單 278
14-4-4  顯示進入時間 279
14-4-5  顯示在線時鐘 280
14-4-6  顯示停留時間 281
14-4-7  自動切換成PC版網頁或移動版網頁 282

第15章  jQuery 284
15-1  認識jQuery 284
15-2  使用jQuery的核心 285
15-2-1  選擇元素 286
15-2-2  操作DOM對象 287
15-2-3  設置CSS樣式和維度 293
15-3  事件 294
15-3-1  .on()方法 294
15-3-2  .off()方法 296
15-3-3  .ready()方法 297
15-4  特效 298
15-4-1  基本特效 298
15-4-2  淡入/淡出/滑動移入/滑動移出特效 300
15-4-3  自定義特效 301

第16章  jQuery UI 304
16-1  認識jQuery UI 304
16-2  使用jQuery UI 305
16-3  Dialog組件（對話框） 307
16-4  Datepicker組件（日期選擇器） 309
16-5  Button組件（按鈕） 312
16-6  Checkboxradio組件 313
16-7  Selectmenu組件（下拉式菜單） 314
16-8  Progress組件（進度條） 316
16-9  Menu組件（菜單） 319
16-10  Tabs組件（標簽頁） 322

第17章  Ajax與JSON 324
17-1  認識動態網頁技術 324
17-1-1  瀏覽器端Script 324
17-1-2  服務器端Script 325
17-2  認識Ajax 327
17-3  編寫導入Ajax技術的動態網頁 328
17-4  使用Ajax技術進行跨網域存取 335
17-4-1  JSON格式 335
17-4-2  $.ajax()方法 336

第18章  響應式網頁設計 339
18-1  開發適用於不同設備的網頁 339
18-1-1  針對不同的設備開發不同的網站 339
18-1-2  響應式網頁設計 340
18-2  響應式網頁設計原則 343
18-3  響應式網頁設計實例 345
18-3-1  編寫HTML文件 346
18-3-2  編寫CSS樣式 349

類似商品