第1章 HTML5基礎(chǔ)知識(shí) 1 1.1 Web技術(shù)和瀏覽器 1 1.2 Web標(biāo)準(zhǔn) 1 1.2.1 什么是Web標(biāo)準(zhǔn) 1 1.2.2 建立Web標(biāo)準(zhǔn)的優(yōu)點(diǎn) 2 1.2.3 理解表現(xiàn)和結(jié)構(gòu)相分離 2 1.3 HTML5概述 3 1.3.1 Web技術(shù)發(fā)展歷程 3 1.3.2 HTML5的特性 4 1.3.3 HTML5元素 4 1.4 HTML5的基本結(jié)構(gòu) 5 1.4.1 HTML5語(yǔ)法結(jié)構(gòu) 5 1.4.2 HTML5編寫(xiě)規(guī)范 6 1.4.3 HTML5文檔結(jié)構(gòu) 6 1.5 創(chuàng)建HTML文件 7 1.6 搭建支持HTML5的瀏覽器 環(huán)境 8 1.7 網(wǎng)頁(yè)頭部標(biāo)簽 9 1.8 注釋 11 1.9 特殊符號(hào) 11 習(xí)題1 12 第2章 編輯網(wǎng)頁(yè)元素 13 2.1 文本元素 13 2.2 文本層次語(yǔ)義元素 15 2.3 基本排版元素 17 2.4 圖像 21 2.4.1 網(wǎng)頁(yè)圖像的格式及使用 要點(diǎn) 21 2.4.2 圖像標(biāo)簽 22 2.4.3 設(shè)置網(wǎng)頁(yè)背景圖像 24 2.4.4 圖文混排 24 2.4.5 案例—制作天地環(huán)保 “關(guān)于我們”圖文混排 頁(yè)面 25 2.5 超鏈接 26 2.5.1 超鏈接概述 26 2.5.2 超鏈接的應(yīng)用 26 2.5.3 案例—制作天地環(huán)保 “下載專區(qū)”頁(yè)面 30 2.6 列表 32 2.6.1 無(wú)序列表 32 2.6.2 有序列表 33 2.6.3 定義列表 34 2.6.4 嵌套列表 35 2.7 ＜div＞標(biāo)簽 35 2.8 ＜span＞標(biāo)簽 36 2.9 綜合案例—制作天地環(huán)保 “公司名片”頁(yè)面 37 習(xí)題2 38 第3章 頁(yè)面的布局與交互 40 3.1 表格 40 3.1.1 表格的結(jié)構(gòu) 40 3.1.2 表格的基本語(yǔ)法 40 3.1.3 表格的屬性 41 3.1.4 不規(guī)范表格 43 3.1.5 表格數(shù)據(jù)的分組 44 3.1.6 表格的嵌套 46 3.1.7 案例—使用表格布局 天地環(huán)保“工程展示” 頁(yè)面 46 3.2 使用結(jié)構(gòu)元素構(gòu)建網(wǎng)頁(yè)布局 47 3.3 頁(yè)面交互元素 53 3.3.1 details元素和summary 元素 53 3.3.2 progress元素 54 3.3.3 meter元素 54 3.4 表單 55 3.4.1 表單的基本概念 55 3.4.2 表單標(biāo)簽 55 3.4.3 表單元素 56 3.4.4 案例—制作天地環(huán)保 “會(huì)員注冊(cè)”表單 60 3.4.5 表單分組 61 3.4.6 使用表格布局表單 62 3.4.7 表單的高級(jí)用法 63 習(xí)題3 64 第4章 CSS3基礎(chǔ) 66 4.1 CSS概述 66 4.2 CSS的優(yōu)勢(shì)與局限性 68 4.3 CSS語(yǔ)法基礎(chǔ) 70 4.3.1 CSS樣式規(guī)則 70 4.3.2 基本選擇符 71 4.3.3 復(fù)合選擇符 73 4.3.4 通配符選擇符 75 4.3.5 特殊選擇符 76 4.4 CSS的屬性單位 77 4.4.1 長(zhǎng)度、百分比單位 78 4.4.2 色彩單位 78 4.5 網(wǎng)頁(yè)中引用CSS的方法 79 4.5.1 行內(nèi)樣式 79 4.5.2 內(nèi)部樣式表 80 4.5.3 鏈入外部樣式表 81 4.5.4 導(dǎo)入外部樣式表 82 4.5.5 案例—制作“天地環(huán)保 工程簡(jiǎn)介”頁(yè)面 83 4.6 文檔結(jié)構(gòu) 85 4.6.1 文檔結(jié)構(gòu)的基本概念 85 4.6.2 繼承 86 4.6.3 樣式表的層疊、特殊性 與重要性 87 4.6.4 元素類型 88 4.6.5 案例—制作天地環(huán)保 “核心業(yè)務(wù)”局部頁(yè)面 89 習(xí)題4 90 第5章 盒模型 91 5.1 盒模型簡(jiǎn)介 91 5.2 盒模型的屬性 92 5.2.1 邊框 92 5.2.2 外邊距 95 5.2.3 內(nèi)邊距 96 5.2.4 案例—盒模型的演示 97 5.3 盒模型的大小 98 5.3.1 盒模型的寬度與高度 98 5.3.2 設(shè)置塊級(jí)元素與行級(jí) 元素的寬度和高度 98 5.4 盒模型綜合案例—“天地環(huán)保” 頁(yè)面頂部?jī)?nèi)容 99 5.5 盒子的定位 101 5.5.1 定位屬性 101 5.5.2 定位方式 103 5.6 浮動(dòng)與清除浮動(dòng) 106 5.6.1 浮動(dòng) 106 5.6.2 清除浮動(dòng) 109 5.6.3 案例—天地環(huán)�！暗卿洝� 頁(yè)面的整體布局 110 習(xí)題5 112 第6章 使用CSS修飾頁(yè)面外觀 113 6.1 設(shè)置字體樣式 113 6.2 設(shè)置文本樣式 115 6.3 設(shè)置圖像樣式 118 6.3.1 圖像縮放 119 6.3.2 圖像邊框 120 6.3.3 圖像的不透明度 121 6.3.4 背景圖像 121 6.3.5 背景重復(fù) 122 6.3.6 背景圖像定位 123 6.3.7 設(shè)置背景圖像固定 125 6.3.8 背景圖像大小 125 6.4 設(shè)置表格樣式 126 6.4.1 常用的CSS表格屬性 126 6.4.2 案例—使用隔行換色 表格制作“環(huán)保工程年度 排行榜” 128 6.5 設(shè)置表單樣式 129 6.5.1 使用CSS修飾常用的 表單元素 130 6.5.2 案例—制作“天地環(huán)保 用戶調(diào)查”頁(yè)面 131 6.6 設(shè)置鏈接 133 6.6.1 設(shè)置文字鏈接的外觀 133 6.6.2 圖文鏈接 135 6.7 設(shè)置列表 136 6.7.1 表格布局的缺點(diǎn) 136 6.7.2 列表布局的優(yōu)勢(shì) 136 6.7.3 CSS列表屬性 136 6.7.4 案例—制作天地環(huán)保 二維碼名片 140 6.8 創(chuàng)建導(dǎo)航菜單 141 6.9 綜合案例—制作“綠色環(huán)保” 社區(qū)頁(yè)面 144 習(xí)題6 151 第7章 CSS布局技術(shù) 152 7.1 Div+CSS布局技術(shù)簡(jiǎn)介 152 7.2 使用嵌套的Div布局頁(yè)面 153 7.2.1 將頁(yè)面用Div分塊 153 7.2.2 案例—制作“環(huán)�？臻g” 頁(yè)面 153 7.3 典型的CSS布局樣式 156 7.3.1 兩列布局樣式 156 7.3.2 三列布局樣式 159 7.4 綜合案例—制作天地環(huán)保 “博客”頁(yè)面 162 習(xí)題7 170 第8章 JavaScript程序設(shè)計(jì)基礎(chǔ) 171 8.1 JavaScript概述 171 8.2 在網(wǎng)頁(yè)中使用JavaScript 171 8.3 JavaScript基本語(yǔ)法 174 8.4 JavaScript的程序結(jié)構(gòu) 176 8.4.1 簡(jiǎn)單語(yǔ)句 176 8.4.2 程序控制流程 178 8.5 函數(shù) 181 8.6 基于對(duì)象的JavaScript語(yǔ)言 183 8.7 DOM編程 185 8.7.1 window對(duì)象 186 8.7.2 document對(duì)象 187 8.7.3 location對(duì)象 189 8.7.4 history對(duì)象 190 8.7.5 form對(duì)象 190 8.8 JavaScript的對(duì)象事件處理 程序 191 8.8.1 對(duì)象的事件 191 8.8.2 常用的事件及處理 191 8.8.3 表單對(duì)象與交互性 194 8.9 綜合案例—Web頁(yè)面信息 交互 196 習(xí)題8 197 第9章 HTML5的高級(jí)應(yīng)用 199 9.1 HTML5拖放API 199 9.1.1 draggable屬性 199 9.1.2 拖放觸發(fā)的事件和數(shù)據(jù) 傳遞 200 9.2 多媒體播放 202 9.2.1 HTML5的多媒體支持 202 9.2.2 音頻標(biāo)簽 203 9.2.3 視頻標(biāo)簽 204 9.2.4 HTML5多媒體API 205 9.3 Canvas繪圖 207 9.3.1 創(chuàng)建＜canvas＞元素 207 9.3.2 構(gòu)建繪圖環(huán)境 208 9.3.3 通過(guò)JavaScript繪制 圖形 208 9.4 HTML5地理定位API 216 9.4.1 Geolocation基礎(chǔ) 216 9.4.2 Geolocation API實(shí)現(xiàn) 地理定位 217 9.4.3 案例—使用HTML5 獲取地理位置及百度 地圖 218 9.5 HTML5的發(fā)展前景 221 習(xí)題9 221 第10章 jQuery基礎(chǔ) 222 10.1 jQuery概述 222 10.2 編寫(xiě)jQuery程序 223 10.3 jQuery對(duì)象和DOM對(duì)象 224 10.3.1 jQuery對(duì)象和DOM 對(duì)象簡(jiǎn)介 224 10.3.2 jQuery對(duì)象和DOM 對(duì)象的相互轉(zhuǎn)換 225 10.4 jQuery插件 228 10.5 jQuery選擇器簡(jiǎn)介 228 10.6 基礎(chǔ)選擇器 229 10.7 層次選擇器 234 10.8 過(guò)濾選擇器 237 10.9 表單選擇器 241 10.10 jQuery的基本操作 242 10.10.1 元素屬性的操作 242 10.10.2 元素樣式的操作 245 10.10.3 元素內(nèi)容和值的 操作 247 習(xí)題10 249 第11章 jQuery的動(dòng)畫(huà)效果 251 11.1 jQuery的動(dòng)畫(huà)方法簡(jiǎn)介 251 11.2 顯示與隱藏效果 252 11.3 淡入/淡出效果 255 11.4 滑動(dòng)效果 258 11.5 綜合案例—制作折疊式 導(dǎo)航菜單 260 習(xí)題11 262 第12章 jQuery UI插件的用法 263 12.1 jQuery UI概述 263 12.2 jQuery UI的常用插件 267 12.2.1 日期選擇器插件 267 12.2.2 折疊面板插件 268 12.2.3 標(biāo)簽頁(yè)插件 271 12.2.4 自動(dòng)完成插件 272 習(xí)題12 275 第13章 天地環(huán)保綜合案例網(wǎng)站 277 13.1 網(wǎng)站的開(kāi)發(fā)流程和組織結(jié)構(gòu) 277 13.1.1 網(wǎng)站的開(kāi)發(fā)流程 277 13.1.2 創(chuàng)建站點(diǎn)目錄 278 13.1.3 網(wǎng)站頁(yè)面的組成 279 13.2 網(wǎng)站技術(shù)分析 279 13.3 制作網(wǎng)站首頁(yè) 280 13.4 制作聯(lián)系我們頁(yè)面 291 13.5 實(shí)訓(xùn)網(wǎng)站 292 習(xí)題13 292