●第1章 認識HTML 5 0011.1 HTML的基本概念和版本 0021.1.1 什麼是HTML 0021.1.2 HTML的版本 0021.2 HTML文件的基本結構 0031.3 HTML 5的基本標記 0031.3.1 文檔類型說明 0031.3.2 html標記 0041.3.3 頭標記 0041.3.4 主體標記 0061.3.5 注釋標記 0071.4 HTML 5網頁的開發環境 0071.4.1 使用記事本手工編寫HTML文件 0081.4.2 使用WebStorm編寫HTML文件 0081.5 新手常見疑難問題 0121.6 實戰技能訓練營 013第2章 設計網頁的文本 0142.1 標題 0152.1.1 標題文字標簽 0152.1.2 標題的對齊方式 0162.2 設置文字格式 0172.2.1 文字的字體、字號和顏色 0172.2.2 文字的粗體、斜體和下劃線 0182.2.3 文字的上標和下標 0192.3 設置段落格式 0192.3.1 段落標簽 0202.3.2 段落的換行標簽 0202.3.3 段落的原格式標簽 0212.4 網頁的水平線 0212.4.1 添加水平線 0212.4.2 設置水平線的寬度與高度 0222.5 新手常見疑難問題 0232.6 實戰技能訓練營 023第3章 設計網頁列表與段落 0243.1 無序列表 0253.1.1 無序列表的標簽 0253.1.2 無序列表的屬性 0253.2 有序列表 0263.2.1 有序列表的標簽 0263.2.2 有序列表的屬性 0273.3 自定義列表 0283.4 列表的嵌套 0293.5 新手常見疑難問題 0293.6 實戰技能訓練營 030第4章 網頁中的圖像和超鏈接 0314.1 網頁中的圖像 0324.1.1 網頁中支持的圖片格式 0324.1.2 圖像中的路徑 0324.2 在網頁中插入圖像 0344.3 編輯網頁中的圖像 0354.3.1 設置圖像的大小和邊框 0354.3.2 設置圖像的間距和對齊方式 0364.3.3 設置圖像的替換文字和提示文字 0374.4 認識網頁超鏈接 0384.4.1 什麼是網頁超鏈接 0384.4.2 超鏈接中的URL 0384.4.3 超鏈接的URL類型 0394.5 建立網頁超級鏈接 0394.5.1 創建超文本鏈接 0394.5.2 創建圖片鏈接 0404.5.3 創建下載鏈接 0414.5.4 使用相對路徑和絕對路徑 0414.5.5 設置以新窗口顯示超鏈接頁面 0424.5.6 設置電子郵件鏈接 0434.6 使用浮動框架 0444.7 使用書簽鏈接制作電子書閱讀網頁 0454.8 圖像熱點鏈接 0464.9 新手常見疑難問題 0484.10 實戰技能訓練營 049第5 章 表格與
標簽 0515.1 表格的基本結構 0525.2 創建表格 0535.2.1 創建普通表格 0535.2.2 創建一個帶有標題的表格 0545.3 編輯表格 0545.3.1 定義表格的邊框類型 0545.3.2 定義表格的表頭 0555.3.3 設置表格背景 0565.3.4 格的背景 0575.3.5 格 0585.3.6 表格的分組 0605.3.7 格的行高與列寬 0615.4 完整的表格標簽 0625.5 設置懸浮變色的表格 0635.6
標簽 0655.7 標簽 0665.8 新手常見疑難問題 0675.9 實戰技能訓練營 067第6 章 網頁中的表單 0696.1 表單概述 0706.2 輸入標簽 0706.2.1 文本框 0706.2.2 單選按鈕和復選框 0736.2.3 按鈕 0746.3 圖像域和文件域 0766.4 列表 0776.5 表單素 0786.5.1 url 屬性 0786.5.2 email 屬性 0796.5.3 date 和time 屬性 0806.5.4 number 屬性 0806.5.5 range 屬性 0816.5.6 required 屬性 0826.6 新手常見疑難問題 0826.7 實戰技能訓練營 083第7 章 網頁中的多媒體 0847.1 audio 標簽概述 0857.1.1 認識audio 標簽 0857.1.2 audio 標簽的屬性 0857.1.3 audio 標簽對瀏覽器的支持情況 0867.2 在網頁中添加音頻文件 0867.3 video 標簽 0877.3.1 認識video 標簽 0877.3.2 video 標簽的屬性 0887.3.3 瀏覽器對video 標簽的支持情況 0897.4 在網頁中添加視頻文件 0897.5 新手常見疑難問題 0917.6 實戰技能訓練營 091第8 章 HTML 5 的新特征 0928.1 新增的主素 0938.1.1 secti素 0938.1.2 artic素 0938.1.3 asi素 0968.1.4 n素 0978.1.5 ti素 0998.2 新增的非主素 1008.2.1 head素 1008.2.2 hgro素 1018.2.3 foot素 1028.2.4 figu素 1038.2.5 addre素 1048.3 新增其素 1058.3.1 ma素 1068.3.2 素、素與ru素 1068.3.3 progre素 1078.3.4 comma素 1088.3.5 emb素 1088.3.6 detai素和summa素 1098.3.7 datali素 1108.3.8 met素 1118.4 新增全局屬性 1128.4.1 contentEditable 屬性 1128.4.2 spellcheck 屬性 1128.4.3 tabIndex 屬性 1138.5 新增的其他屬性 1148.5.1 表單相關屬性 1148.5.2 鏈接相關屬性 1198.5.3 其他新增屬性 1198.6 HTML 5 廢除的屬性 1208.7 新手常見疑難問題 1218.8 實戰技能訓練營 121第9 章 使用CSS 層疊樣式表 1239.1 CSS 概述 1249.1.1 CSS 的功能 1249.1.2 瀏覽器與CSS 1249.1.3 CSS 的基礎語法 1259.2 在HTML 中使用CSS 的方法 1259.2.1 行內樣式 1259.2.2 內嵌樣式 1269.2.3 鏈接樣式 1279.3 CSS 中的常用樣式 1289.3.1 使用字體樣式 1289.3.2 使用文本樣式 1319.3.3 使用背景樣式 1359.3.4 設計邊框樣式 1389.3.5 設置列表樣式 1419.4 新手常見疑難問題 1449.5 實戰技能訓練營 144第10 章 JavaScript 和jQuery 14610.1 認識JavaScript 14710.1.1 什麼是JavaScript 14710.1.2 在HTML 網頁頭中嵌入JavaScript代碼 14710.2 JavaScript 對像與函數 14810.2.1 認識對像 14810.2.2 認識函數 14910.3 JavaScript 事件 15010.3.1 事件與事件處理概述 15010.3.2 JavaScript 的常用事件 15110.4 認識jQuery 15210.4.1 jQuery 能做什麼 15210.4.2 jQuery 的配置 15310.5 jQuery 選擇器 15310.5.1 jQuery 的工廠函數 15310.5.2 常見選擇器 15410.6 新手常見疑難問題 15510.7 實戰技能訓練營 156第11 章 繪制圖形 15711.1 添加canvas 的步驟 15811.2 繪制基本形狀 15811.2.1 繪制矩形 15911.2.2 繪制圓形 15911.2.3 使用moveTo 與lineTo 繪制直線 16011.2.4 使用bezierCurveTo 繪制貝濟埃曲線 16111.3 繪制漸變圖形 16211.3.1 繪制線性漸變 16211.3.2 繪制徑向漸變 16411.4 繪制變形圖形 16411.4.1 繪制平移效果的圖形 16411.4.2 繪制縮放效果的圖形 16511.4.3 繪制旋轉效果的圖形 16611.4.4 繪制組合效果的圖形 16711.4.5 繪制帶陰影的圖形 16811.5 使用圖像 16911.5.1 繪制圖像 16911.5.2 平鋪圖像 17011.5.3 裁剪圖像 17111.6 繪制文字 17311.7 圖形的保存與恢復 17411.7.1 保存與恢復狀態 17411.7.2 保存文件 17511.8 新手常見疑難問題 17611.9 實戰技能訓練營 176第12 章 文件與拖放 17712.1 選擇文件 17812.1.1 選擇單個文件 17812.1.2 選擇多個文件 17812.2 使用FileReader 接口讀取文件 17912.2.1 檢測瀏覽器是否支持FileReader接口 17912.2.2 FileReader 接口的方法 18012.2.3 使用readAsDataURL 方法預覽圖片 18012.2.4 使用readAsText 方法讀取文本文件 18112.3 使用HTML5 實現文件的拖放 18312.3.1 認識文件拖放的過程 18312.3.2 瀏覽器支持情況 18312.3.3 在網頁中拖放圖片 18412.4 在網頁中來回拖放圖片 18512.5 在網頁中拖放文字 18512.6 新手常見疑難問題 18712.7 實戰技能訓練營 188第13 章 地理定位技術 18913.1 Geolocation API 獲取地理位置 19013.1.1 地理地位的原理 19013.1.2 獲取定位信息的方法 19013.1.3 常用地理定位方法 19013.1.4 判斷瀏覽器是否支持HTML 5 獲取地理位置信息 19113.1.5 指定緯度和經度坐標 19213.1.6 獲取當前位置的緯度與經度 19313.1.7 處理錯誤和拒絕 19413.2 目前瀏覽器對地理定位的支持情況 19513.3 在網頁中調用Google 地圖 19513.4 新手常見疑難問題 19813.5 實戰技能訓練營 198第14 章 離線Web 應用程序 19914.1 HTML 5 離線Web 應用概述 20014.2 使用HTML5 離線Web 應用API 20014.2.1 檢查瀏覽器的支持情況 20014.2.2 搭建簡單的離線應用程序 20014.2.3 支持離線行為 20114.2.4 Manifest 文件 20114.2.5 ApplicationCache API 20214.3 使用HTML 5 離線Web 應用構建應用 20414.3.1 創建記錄資源的manifest 文件 20414.3.2 創建構成界面的HTML 和CSS 20414.3.3 創建離線的JavaScript 20414.3.4 檢查applicationCache 的支持情況 20514.3.5 為Update 按鈕添加處理函數 20614.3.6 添加Storage 功能代碼 20614.3.7 添加離線事件處理程序 20614.4 新手常見疑難問題 20714.5 實戰技能訓練營 207第15 章 處理線程和服務器發送事件 20815.1 Web Worker 20915.1.1 Web Worker 概述 20915.1.2 線程中常用的變量、函數與類 20915.1.3 與線程進行數據的交互 21015.2 線程嵌套 21215.2.1 單線程嵌套 21215.2.2 多個子線程中的數據交互 21415.3 服務器發送事件概述 21515.4 服務器發送事件的實現過程 21515.4.1 檢測瀏覽器是否支持Server-Sent事件 21515.4.2 使用EventSource 對像 21615.4.3 編寫服務器端代碼 21615.5 創建Web Worker 計數器 21715.6 服務器發送事件實戰應用 21815.7 新手常見疑難問題 21915.8 實戰技能訓練營 220第16 章 數據存儲和通信技術 22116.1 認識Web 存儲 22216.1.1 本地存儲和Cookies 的區別 22216.1.2 Web 存儲方法 22216.2 使用HTML 5 Web Storage API 22216.2.1 測試瀏覽器的支持情況 22216.2.2 使用sessionStorage 方法創建對像 22316.2.3 使用localStorage 方法創建對像 22416.2.4 Web Storage API 的其他操作 22516.2.5 使用JSON 對像存取數據 22616.3 瀏覽器對Web 存儲的支持情況 22816.4 跨文檔消息傳輸 22816.4.1 跨文檔消息傳輸的基本知識 22816.4.2 跨文檔通信應用測試 22916.5 WebSockets API 23116.5.1 什麼是WebSocket API 23116.5.2 WebSockets 通信基礎 23116.5.3 服務器端使用WebSockets API 23216.5.4 客戶機端使用WebSockets API 23516.6 制作簡單的Web 留言本 23616.7 編寫簡單的WebSocket 服務器 23816.8 新手常見疑難問題 24116.9 實戰技能訓練營 242第17 章 響應式網頁設計 24317.1 響應式網頁設計概述 24417.2 像素和屏幕分辨率 24517.3 視口 24517.3.1 視口的分類和常用屬性 24517.3.2 媒體查詢 24617.4 響應式網頁的布局設計 24717.4.1 常用布局類型 24717.4.2 布局的實現方式 24717.4.3 響應式布局的設計與實現 24817.5 響應式圖片 24817.5.1 使用
標簽 24817.5.2 使用CSS 圖片 24917.6 響應式視頻 25117.7 響應式導航菜單 25117.8 響應式表格 25317.8.1 隱藏表格中的列 25317.8.2 滾動表格中的列 25417.8.3 轉換表格中的列 25617.9 新手常見疑難問題 25817.10 實戰技能訓練營 259第18 章 響應式開發框架Bootstrap 26018.1 Bootstrap 概述 26118.1.1 Bootstrap 的特色 26118.1.2 Bootstrap 4 的重大更新 26118.2 下載Bootstrap 26218.3 安裝和使用Bootstrap 26418.3.1 本地安裝Bootstrap 26418.3.2 初次使用Bootstrap 26418.4 使用常用組件 26518.4.1 使用下拉菜單 26518.4.2 使用按鈕組 26618.4.3 使用導航組件 26718.4.4 綁定導航和下拉菜單 26918.4.5 使用面包屑導航 27018.4.6 使用廣告屏 27118.4.7 使用card(卡片) 27218.4.8 使用進度條 27418.4.9 使用模態框 27718.4.10 使用滾動監聽 27918.5 膠囊導航選項卡(Tab 欄) 28118.6 新手常見疑難問題 28318.7 實戰技能訓練營 284第19 章 綜合項目1——開發連鎖咖啡響應式網站 28519.1 網站概述 28619.1.1 網站結構 28619.1.2 設計效果 28619.1.3 設計準備 28719.2 設計首頁布局 28819.3 設計可切換導航 28919.4 主體內容 29319.4.1 設計輪播廣告區 29319.4.2 設計產品推薦區 29519.4.3 設計登錄、注冊按鈕和Logo 29619.4.4 設計特色展示區 29619.4.5 設計產品生產流程區 29819.5 設計底部隱藏導航 300第20 章 綜合項目2——開發房產企業響應式網站 30120.1 網站概述 30220.1.1 網站結構 30220.1.2 設計效果 30220.1.3 設計準備 30320.2 設計主頁 30320.2.1 主頁布局 30320.2.2 設計導航條 30420.2.3 設計輪播廣告 30620.2.4 設計功能區 30820.2.5 設計特色展示 30920.2.6 設計腳注 31220.3 設計側邊導航欄 31420.4 設計登錄頁 316第21 章 綜合項目3——開發在線視頻娛樂網站 31821.1 整體布局 31921.1.1 設計分析 31921.1.2 排版架構 32021.2 模塊組成 32021.3 制作步驟 32121.3.1 制作樣式表 32121.3.2 Logo 與導航菜單 32521.3.3 搜索條 32621.3.4 左側視頻模塊 32621.3.5 評論模塊 32721.3.6 右側熱門推薦 32821.3.7 底部模塊 330第22 章 綜合項目4——開發企業門戶類網站 33122.1 整體布局 33222.1.1 設計分析 33222.1.2 排版架構 33322.2 模塊組成 33322.3 制作步驟 33322.3.1 樣式表 33322.3.2 網頁頭部 33422.3.3 導航菜單欄 33522.3.4 中間主體第一欄 33622.3.5 中間主體第二欄 33922.3.6 中間主體第三欄 34122.3.7 中間主體第四欄 34622.3.8 中間主體第五欄 35022.3.9 網頁底部 354
《HTML5 Web開發(全案例微課版)》是針對零基礎讀者編寫的Web入門教材。該書側重案例實訓,並提供掃碼微課來講解當前熱門的案例。《HTML5 Web開發(全案例微課版)》分為22章,內容包括認識HTML 5、設計網頁的文本、設計網頁列表與段落、網頁中的圖 像和超鏈接、表格與div標簽、網頁中的表單、網頁中的多媒體、HTML5的新特征、使用CSS層疊樣式表、JavaScript和jQuery、繪制圖形、文件與拖放、地理定位技術、離線Web應用程序、處理線程 和服務器發送事件、數據存儲和通信技術、響應式網頁設計、流行的響應式開發框架Bootstrap,最後通過4個熱門綜合項目,讓讀者進一步掌握項目開發經驗。《HTML5 Web開發(全案例微課版)》通過精選熱門案例,讓初學者快速掌握HTML5 Web開發技術。通過掃碼看視頻,可以隨時在移動端學習技能對應的視頻操作。本書適合讀者自學等
劉輝編著 著
劉輝,主要負責網頁設計、網站開發和Android開發課程,擅長HTML5、CSS3、JavaScript、jQuery技術,一直負責畢業班的實訓工作,在移動終端軟件開發方面有多年的開發經驗,具有很強的實戰經驗。