完整解說HTML5元素
WebVTT建立多國語言字幕
完整解說CSS3屬性
JavaScript完整實例
BOM與DOM完整實例
回應式(RWD)網頁設計
Canvas繪圖與動畫
Google Maps 設計地圖導航
jQuery Mobile 手機網頁
PhoneGap 建立手機App
全書包含約600個程式實例
這是一本從入門到完整學習的網頁設計書籍,第一篇,依照網頁功能,以10個章節完整的講解HTML語法,讀者可由此建立基礎知識。第二篇則是依照CSS功能,將網頁編排的完整知識,以14章節依照功能完整解說。第三篇則從JavaScript開始做說明,當讀者有了JavaScript的知識後,接著講解網頁設計的進階功能,BOM、DOM、RWD、Canvas、Google Maps API、jQuery Mobile等,相信讀者完全學習本書後,將可邁向網頁設計高手之路。
目錄
第一篇 HTML5 完整學習
Chapter 01 HTML5 的歷史
Chapter 02 HTML5 從零開始
Chapter 03 HTML 文件的輸出的基本知識
Chapter 04 設計含超連結的網頁
Chapter 05 製作項目清單
Chapter 06 設計表格
Chapter 07 嵌入圖片
Chapter 08 設計多媒體網頁
Chapter 09 製作輸入表單
Chapter 10 HTML 功能總結
第二篇 CSS3 完整學習
Chapter 11 CSS3 的基礎知識
Chapter 12 段落文字的編排知識
Chapter 13 將CSS 應用在項目清單
Chapter 14 設計背景
Chapter 15 完整學習Box Model
Chapter 16 將CSS 應用在表格資料
Chapter 17 設計漸層效果
Chapter 18 設計多欄位的版面
Chapter 19 定位與網頁排版
Chapter 20 使用彈性容器(Flexible Container)排版
Chapter 21 動畫設計 - 漸變效果
Chapter 22 設計網頁動畫
Chapter 23 變形動畫
Chapter 24 回應式(RWD)網頁設計
第三篇 邁向網頁設計高手之路
Chapter 25 JavaScript 基礎知識
Chapter 26 JavaScript 的流程控制
Chapter 27 JavaScript 的函數設計
Chapter 28 瀏覽器物件模型BOM
Chapter 29 HTML 的文件物件模型DOM
Chapter 30 HTML Canvas 繪圖與動畫
Chapter 31 Google Maps API
Chapter 32 jQuery Mobile 行動網頁設計
Chapter 33 將網頁轉成App 應用程式
Appendix A HTML 標籤列表
Appendix B HTML 屬性索引表
Appendix C CSS 屬性索引表
Appendix D 認識網頁設計的長度單位
Appendix E 認識網頁設計的顏色
序言
多年自我學習與教學經驗,筆者深刻體會建立紮實學識基礎的重要,因此本書一開始並不是介紹一些炫耀的功能,而是一步一步將HTM5 元素與CSS3 屬性依功能分類,詳細的用程式實例做解說,期待讀者以最輕鬆方式學會網頁設計基礎知識。
這本書分成三篇:
‰ 第一篇:HTML5
這是學習網頁設計的基礎,筆者幾乎將所有HTML5 的元素(Element)依功能分類,分成10 個章節,用了約150 個程式實例與圖檔做說明,相信讀者可以由此建立HTML 的紮實基礎。
‰ 第二篇:CSS3
這是學習網頁編輯與美化,筆者幾乎將所有CSS3 的屬性(Properties)依功能分類,分成14 個章節,用了約240 個程式實例與圖檔做說明,在此讀者可以徹底學會網頁編輯與美化的基礎與技巧。
‰ 第三篇:邁向網頁設計高手之路
在這篇中最基礎的是JavaScript,當你學會之後,可以繼續閱讀網頁結構的知識BOM 與DOM,後面章節你可以挑選有興趣的主題閱讀。如果你對於動畫有興趣可以閱讀Canvas,如果對於設計汽車導航與地圖定位有興趣可以閱讀Google Map API,如果希望學習設計專注手機或平板的網頁可以參考jQuery Mobile。本書在最後一章,以實例說明將網頁轉成App 應用程式,未來各位可以隨時將HTML+CSS+JavaScript 所開發的網頁轉成App。在這一篇筆者用了約210 個程式實例與圖檔做解說,這將對各位學習進階的網頁設計有很大的幫助。
HTML5+CSS3 已經將整個網頁設計的觀念翻轉了,過去設計網頁可以在HTML文件內做編輯美化,如今這些工作已經全部交由CSS 處理。所以許多原先版本的元素或屬性已經被棄用,筆者在撰寫這本書時也特別謹慎小心,原則是在程式內容中不再放入已經棄用的元素與屬性,以免誤導讀者。另外,最新流行的回應式網頁設計,筆者也將以實例做解說。筆者經驗是在設計網頁過程,隨時需要參考HTML 與CSS 的語法,為了協助讀者可以很方便查詢,本書附錄包含了HTML 元素與屬性的索引表,也包含了CSS 屬性的索引表,這將是各位現在學習與未來隨時需查詢與參考的一大利器。
其實前2 篇的內容已經足夠讓你成為前端的網&# 3 8 9 1 3 ; &# 3 5 3 7 3 ; &# 3 5 3 3 6 ; &# 2 4 1 0 7 ; &# 2 0 1 0 2 ; &# 6 5 2 9 2 ; &# 2 2 9 1 4 ; &# 2 6 5 2 4 ; &# 2 0 3 2 0 ; &# 2 6 1 5 9 ; &# 2 6 3 7 7 ; &# 3 3 2 8 8 ; &# 3 6 2 5 9 ; &# 3 2 3 8 0 ; &# 3 2 3 9 6 ; &# 3 8 0 1 3 ; &# 3 0 7 4 0 ; &# 6 5 2 9 2 ; &# 2 4 3 1 4 ; &# 3 5 6 9 6 ; &# 2 0 3 2 0 ; &# 2 1 4 8 7 ; &# 2 0 1 9 7 ; &# 3 8 2 8 3 ; &# 2 2 9 8 7 ; &# 3 8 3 2 1 ; &# 3 5 7 1 2 ; &# 3 1 5 3 2 ; &# 1 9 9 7 7 ; &# 3 1 6 8 7 ; &# 3 6 9 9 3 ; &# 2 1 5 2 1 ; &# 3 2 1 7 8 ; &# 3 8 9 1 3 ; &# 3 5 3 7 3 ; &# 3 5 3 3 6 ; &# 3 9 6 4 0 ; &# 2 5 1 6 3 ; &# 2 0 0 4 3 ; &# 3 6 3 3 5 ; &# 6 5 2 9 2 ; &# 2 3 5 3 1 ; &# 3 6 9 4 2 ; &# 3 5 3 7 7 ; &# 2 2 8 1 0 ; &# 3 0 3 4 0 ; &# 3 8 6 5 1 ; &# 3 3 1 2 6 ; &# 2 6 3 6 0 ; &# 3 3 8 7 9 ; &# 2 0 3 1 6 ; &# 6 5 2 9 2 ; &# 2 6 4 1 2 ; &# 2 6 3 6 0 ; &# 2 7 8 3 9 ; &# 3 5 1 8 6 ; &# 3 1 5 5 8 ; &# 3 2 7 7 3 ; &# 3 3 8 7 9 ; &# 2 0 3 1 6 ; &# 3 0 3 4 0 ; &# 2 9 3 0 5 ; &# 3 3 3 9 4 ; &# 6 5 2 9 2 ; &# 3 1 2 4 3 ; &# 2 4 3 3 5 ; &# 2 3 5 2 6 ; &# 2 0 3 6 3 ; &# 3 5 9 2 0 ; &# 2 3 5 0 0 ; &# 6 5 2 9 2 ; &# 3 0 4 5 6 ; &# 2 0 4 4 9 ; &# 3 5 7 1 2 ; &# 3 2 7 7 3 ; &# 2 1 4 8 2 ; &# 3 5 2 0 1 ; &# 3 6 9 8 1 ; &# 2 4 4 9 0 ; &# 2 6 4 1 2 ; &# 2 6 3 6 0 ; &# 2 0 8 3 9 ; &# 2 3 4 8 1 ; &# 2 4 5 1 7 ; &# 2 3 4 5 0 ; &# 2 1 4 8 7 ; &# 2 0 1 9 7 ; &# 2 2 3 1 2 ; &# 2 6 3 6 8 ; &# 3 0 7 0 1 ; &# 2 6 1 7 8 ; &# 3 8 2 9 1 ; &# 3 1 9 3 4 ; &# 3 6 8 9 0 ; &# 3 2 1 7 8 ; &# 3 8 9 1 3 ; &# 3 5 3 7 3 ; &# 3 5 3 3 6 ; &# 6 5 2 9 2 ; &# 3 2 2 3 2 ; &# 3 3 8 7 9 ; &# 2 6 4 1 2 ; &# 2 6 3 6 0 ; &# 3 8 6 1 4 ; &# 2 1 1 4 7 ; &# 2 7 7 1 4 ; &# 2 3 4 3 6 ; &# 3 2 6 5 4 ; &# 6 5 2 9 2 ; &# 2 0 2 9 4 ; &# 2 6 1 5 9 ; &# 2 3 4 1 6 ; &# 3 2 1 4 7 ; &# 2 7 5 1 1 ; &# 1 9 9 8 1 ; &# 3 6 2 7 5 ; &# 6 5 2 9 2 ; &# 3 5 6 2 8 ; &# 3 5 4 9 2 ; &# 3 8 6 2 7 ; &# 2 0 8 1 3 ; &# 6 5 2 9 2 ; &# 2 3 5 7 8 ; &# 3 1 0 4 8 ; &# 3 5 7 1 2 ; &# 3 2 7 7 3 ; &# 1 9 9 8 1 ; &# 2 1 5 3 3 ; &# 2 5 3 5 1 ; &# 2 7 4 9 1 ; &# 1 2 2 9 0 ; b r / > &# 2 7 9 4 6 ; &# 3 7 6 7 0 ; &# 3 9 7 4 5 ; &# 3 2 ; &# 5 0
WebVTT建立多國語言字幕
完整解說CSS3屬性
JavaScript完整實例
BOM與DOM完整實例
回應式(RWD)網頁設計
Canvas繪圖與動畫
Google Maps 設計地圖導航
jQuery Mobile 手機網頁
PhoneGap 建立手機App
全書包含約600個程式實例
這是一本從入門到完整學習的網頁設計書籍,第一篇,依照網頁功能,以10個章節完整的講解HTML語法,讀者可由此建立基礎知識。第二篇則是依照CSS功能,將網頁編排的完整知識,以14章節依照功能完整解說。第三篇則從JavaScript開始做說明,當讀者有了JavaScript的知識後,接著講解網頁設計的進階功能,BOM、DOM、RWD、Canvas、Google Maps API、jQuery Mobile等,相信讀者完全學習本書後,將可邁向網頁設計高手之路。
目錄
第一篇 HTML5 完整學習
Chapter 01 HTML5 的歷史
Chapter 02 HTML5 從零開始
Chapter 03 HTML 文件的輸出的基本知識
Chapter 04 設計含超連結的網頁
Chapter 05 製作項目清單
Chapter 06 設計表格
Chapter 07 嵌入圖片
Chapter 08 設計多媒體網頁
Chapter 09 製作輸入表單
Chapter 10 HTML 功能總結
第二篇 CSS3 完整學習
Chapter 11 CSS3 的基礎知識
Chapter 12 段落文字的編排知識
Chapter 13 將CSS 應用在項目清單
Chapter 14 設計背景
Chapter 15 完整學習Box Model
Chapter 16 將CSS 應用在表格資料
Chapter 17 設計漸層效果
Chapter 18 設計多欄位的版面
Chapter 19 定位與網頁排版
Chapter 20 使用彈性容器(Flexible Container)排版
Chapter 21 動畫設計 - 漸變效果
Chapter 22 設計網頁動畫
Chapter 23 變形動畫
Chapter 24 回應式(RWD)網頁設計
第三篇 邁向網頁設計高手之路
Chapter 25 JavaScript 基礎知識
Chapter 26 JavaScript 的流程控制
Chapter 27 JavaScript 的函數設計
Chapter 28 瀏覽器物件模型BOM
Chapter 29 HTML 的文件物件模型DOM
Chapter 30 HTML Canvas 繪圖與動畫
Chapter 31 Google Maps API
Chapter 32 jQuery Mobile 行動網頁設計
Chapter 33 將網頁轉成App 應用程式
Appendix A HTML 標籤列表
Appendix B HTML 屬性索引表
Appendix C CSS 屬性索引表
Appendix D 認識網頁設計的長度單位
Appendix E 認識網頁設計的顏色
序言
多年自我學習與教學經驗,筆者深刻體會建立紮實學識基礎的重要,因此本書一開始並不是介紹一些炫耀的功能,而是一步一步將HTM5 元素與CSS3 屬性依功能分類,詳細的用程式實例做解說,期待讀者以最輕鬆方式學會網頁設計基礎知識。
這本書分成三篇:
‰ 第一篇:HTML5
這是學習網頁設計的基礎,筆者幾乎將所有HTML5 的元素(Element)依功能分類,分成10 個章節,用了約150 個程式實例與圖檔做說明,相信讀者可以由此建立HTML 的紮實基礎。
‰ 第二篇:CSS3
這是學習網頁編輯與美化,筆者幾乎將所有CSS3 的屬性(Properties)依功能分類,分成14 個章節,用了約240 個程式實例與圖檔做說明,在此讀者可以徹底學會網頁編輯與美化的基礎與技巧。
‰ 第三篇:邁向網頁設計高手之路
在這篇中最基礎的是JavaScript,當你學會之後,可以繼續閱讀網頁結構的知識BOM 與DOM,後面章節你可以挑選有興趣的主題閱讀。如果你對於動畫有興趣可以閱讀Canvas,如果對於設計汽車導航與地圖定位有興趣可以閱讀Google Map API,如果希望學習設計專注手機或平板的網頁可以參考jQuery Mobile。本書在最後一章,以實例說明將網頁轉成App 應用程式,未來各位可以隨時將HTML+CSS+JavaScript 所開發的網頁轉成App。在這一篇筆者用了約210 個程式實例與圖檔做解說,這將對各位學習進階的網頁設計有很大的幫助。
HTML5+CSS3 已經將整個網頁設計的觀念翻轉了,過去設計網頁可以在HTML文件內做編輯美化,如今這些工作已經全部交由CSS 處理。所以許多原先版本的元素或屬性已經被棄用,筆者在撰寫這本書時也特別謹慎小心,原則是在程式內容中不再放入已經棄用的元素與屬性,以免誤導讀者。另外,最新流行的回應式網頁設計,筆者也將以實例做解說。筆者經驗是在設計網頁過程,隨時需要參考HTML 與CSS 的語法,為了協助讀者可以很方便查詢,本書附錄包含了HTML 元素與屬性的索引表,也包含了CSS 屬性的索引表,這將是各位現在學習與未來隨時需查詢與參考的一大利器。
其實前2 篇的內容已經足夠讓你成為前端的網&# 3 8 9 1 3 ; &# 3 5 3 7 3 ; &# 3 5 3 3 6 ; &# 2 4 1 0 7 ; &# 2 0 1 0 2 ; &# 6 5 2 9 2 ; &# 2 2 9 1 4 ; &# 2 6 5 2 4 ; &# 2 0 3 2 0 ; &# 2 6 1 5 9 ; &# 2 6 3 7 7 ; &# 3 3 2 8 8 ; &# 3 6 2 5 9 ; &# 3 2 3 8 0 ; &# 3 2 3 9 6 ; &# 3 8 0 1 3 ; &# 3 0 7 4 0 ; &# 6 5 2 9 2 ; &# 2 4 3 1 4 ; &# 3 5 6 9 6 ; &# 2 0 3 2 0 ; &# 2 1 4 8 7 ; &# 2 0 1 9 7 ; &# 3 8 2 8 3 ; &# 2 2 9 8 7 ; &# 3 8 3 2 1 ; &# 3 5 7 1 2 ; &# 3 1 5 3 2 ; &# 1 9 9 7 7 ; &# 3 1 6 8 7 ; &# 3 6 9 9 3 ; &# 2 1 5 2 1 ; &# 3 2 1 7 8 ; &# 3 8 9 1 3 ; &# 3 5 3 7 3 ; &# 3 5 3 3 6 ; &# 3 9 6 4 0 ; &# 2 5 1 6 3 ; &# 2 0 0 4 3 ; &# 3 6 3 3 5 ; &# 6 5 2 9 2 ; &# 2 3 5 3 1 ; &# 3 6 9 4 2 ; &# 3 5 3 7 7 ; &# 2 2 8 1 0 ; &# 3 0 3 4 0 ; &# 3 8 6 5 1 ; &# 3 3 1 2 6 ; &# 2 6 3 6 0 ; &# 3 3 8 7 9 ; &# 2 0 3 1 6 ; &# 6 5 2 9 2 ; &# 2 6 4 1 2 ; &# 2 6 3 6 0 ; &# 2 7 8 3 9 ; &# 3 5 1 8 6 ; &# 3 1 5 5 8 ; &# 3 2 7 7 3 ; &# 3 3 8 7 9 ; &# 2 0 3 1 6 ; &# 3 0 3 4 0 ; &# 2 9 3 0 5 ; &# 3 3 3 9 4 ; &# 6 5 2 9 2 ; &# 3 1 2 4 3 ; &# 2 4 3 3 5 ; &# 2 3 5 2 6 ; &# 2 0 3 6 3 ; &# 3 5 9 2 0 ; &# 2 3 5 0 0 ; &# 6 5 2 9 2 ; &# 3 0 4 5 6 ; &# 2 0 4 4 9 ; &# 3 5 7 1 2 ; &# 3 2 7 7 3 ; &# 2 1 4 8 2 ; &# 3 5 2 0 1 ; &# 3 6 9 8 1 ; &# 2 4 4 9 0 ; &# 2 6 4 1 2 ; &# 2 6 3 6 0 ; &# 2 0 8 3 9 ; &# 2 3 4 8 1 ; &# 2 4 5 1 7 ; &# 2 3 4 5 0 ; &# 2 1 4 8 7 ; &# 2 0 1 9 7 ; &# 2 2 3 1 2 ; &# 2 6 3 6 8 ; &# 3 0 7 0 1 ; &# 2 6 1 7 8 ; &# 3 8 2 9 1 ; &# 3 1 9 3 4 ; &# 3 6 8 9 0 ; &# 3 2 1 7 8 ; &# 3 8 9 1 3 ; &# 3 5 3 7 3 ; &# 3 5 3 3 6 ; &# 6 5 2 9 2 ; &# 3 2 2 3 2 ; &# 3 3 8 7 9 ; &# 2 6 4 1 2 ; &# 2 6 3 6 0 ; &# 3 8 6 1 4 ; &# 2 1 1 4 7 ; &# 2 7 7 1 4 ; &# 2 3 4 3 6 ; &# 3 2 6 5 4 ; &# 6 5 2 9 2 ; &# 2 0 2 9 4 ; &# 2 6 1 5 9 ; &# 2 3 4 1 6 ; &# 3 2 1 4 7 ; &# 2 7 5 1 1 ; &# 1 9 9 8 1 ; &# 3 6 2 7 5 ; &# 6 5 2 9 2 ; &# 3 5 6 2 8 ; &# 3 5 4 9 2 ; &# 3 8 6 2 7 ; &# 2 0 8 1 3 ; &# 6 5 2 9 2 ; &# 2 3 5 7 8 ; &# 3 1 0 4 8 ; &# 3 5 7 1 2 ; &# 3 2 7 7 3 ; &# 1 9 9 8 1 ; &# 2 1 5 3 3 ; &# 2 5 3 5 1 ; &# 2 7 4 9 1 ; &# 1 2 2 9 0 ; b r / > &# 2 7 9 4 6 ; &# 3 7 6 7 0 ; &# 3 9 7 4 5 ; &# 3 2 ; &# 5 0