HTML 5與CSS 3網頁設計入門與提高

《HTML 5與CSS 3網頁設計入門與提高》是2014年清華大學出版社出版的圖書。

基本介紹

• 書名：HTML 5與CSS 3網頁設計入門與提高
• ISBN：9787302384557
• 定價：59元
• 出版時間：2014-12-12
• 裝幀：平裝

圖書簡介

本書從初學者的角度出發，由淺入深、循序漸進地介紹了HTML 5和CSS 3套用與開發的相關知識，書中提供了大量操作HTML 5和CSS 3新增功能的示例，還提供了用於演練的實戰和上機練習。

目錄

第1章HTML快速入門 1

1.1HTML的概念 2

1.2HTML的文檔結構 3

1.2.1文檔編寫規範 3

1.2.2文檔聲明標記 4

1.2.3標記文檔開始 5

1.2.4標記文檔頭部 6

1.2.5標記文檔主體 6

1.2.6編寫注意事項 6

1.2.7實戰——創建第一個HTML文檔 7

1.3文檔基礎標記 9

1.3.1元信息標記 9

1.3.2字型標記 10

1.3.3超連結標記 14

1.3.4水平線標記 16

1.3.5段落標記 17

1.4列表標記 19

1.4.1編號列表 19

1.4.2項目符號列表 21

1.4.3說明項目列表 21

1.5表格標記 22

1.5.1表格的結構 22

1.5.2表格的屬性 23

1.6表單標記 27

1.6.1創建表單 27

1.6.2創建表單元素 27

1.7實戰——製作卡通類頁面 30

1.8本章習題 32

第2章CSS基礎 35

2.1CSS概述 36

2.1.1CSS簡介 36

2.1.2CSS的使用 37

2.2CSS基礎語法 40

2.3CSS高級語法 41

2.4CSS的常用樣式 43

2.4.1CSS常用樣式概述 43

2.4.2背景樣式 44

2.4.3文本樣式 47

2.4.4字型樣式 53

2.4.5連結樣式 58

2.4.6列表樣式 59

2.4.7表格和輪廓 63

2.4.8其他樣式 67

2.5實戰——詩詞鑑賞頁面設計 71

2.6本章習題 73

第3章JavaScript腳本語言 75

3.1JavaScript腳本概述 76

3.2JavaScript的基本語法 77

3.2.1簡單的JavaScript例子 77

3.2.2JavaScript語句 79

3.3JavaScript變數 81

3.3.1變數 81

3.3.2數據類型 82

3.4運算符 86

3.5JavaScript語句的類型 87

3.5.1選擇語句 88

3.5.2循環語句 92

3.5.3跳轉語句 95

3.5.4異常處理語句 96

3.6對象 97

3.6.1對象概述 97

3.6.2函式 99

3.6.3構造函式 100

3.7常用對象 101

3.7.1Array對象 101

3.7.2Document對象 102

3.7.3HTMLDOMEvent對象 103

3.7.4Window對象 104

3.8實戰——長方體幾何計算 105

3.9本章習題 106

第4章網頁設計實戰案例 109

4.1網頁設計流程 110

4.2網頁設計工具 110

4.2.1記事本 111

4.2.2FrontPage 111

4.2.3Dreamweaver 112

4.2.4實戰——製作個人主頁 113

4.3網頁布局 117

4.3.1常見的網頁布局結構 117

4.3.2設計居中布局 120

4.3.3設計自適應布局 121

4.3.4DIV+CSS重構網站布局 122

4.4布局理論 124

4.4.1區塊的概念 124

4.4.2定義區塊 125

4.4.3定位 126

4.4.4實戰——具有固定位置的廣告框 127

4.4.5空白邊疊加 129

4.5實戰——製作網頁導航條 130

4.6實戰——製作文本環繞圖片 132

4.7實戰——製作三欄部落格頁面 133

4.8CSS設計規範 139

4.9本章習題 141

第5章認識HTML5 143

5.1了解HTML5 144

5.1.1HTML5的發展歷史 144

5.1.2開發HTML5的三大組織 144

5.1.3使用HTML5的五大原因 145

5.1.4HTML5的未來發展趨勢 147

5.2HTML5的語法 148

5.2.1文檔媒體類型 148

5.2.2編碼類型 149

5.2.3DOCTYPE聲明 150

5.2.4其他內容 150

5.3HTML5表單 150

5.3.1HTML5輸入類型 150

5.3.2HTML5表單元素 152

5.3.3HTML5表單屬性 152

5.4HTML5的元素 154

5.4.1新增的元素 154

5.4.2更改元素 155

5.4.3廢除的元素 156

5.5HTML5的屬性 157

5.5.1標準屬性 157

5.5.2事件屬性 158

5.6支持HTML5的瀏覽器 161

5.6.1瀏覽器核心 161

5.6.2常用的瀏覽器 162

5.7實戰——Chrome瀏覽器的安裝和測試 164

5.8本章習題 166

第6章HTML5快速入門 169

6.1結構元素 170

6.1.1header元素 170

6.1.2article元素 171

6.1.3section元素 173

6.1.4nav元素 174

6.1.5aside元素 175

6.1.6footer元素 177

6.2分組元素 177

6.2.1hgroup元素 177

6.2.2figcaption和figure 178

6.3文本語義元素 179

6.3.1mark元素 179

6.3.2ruby、rt和rp元素 180

6.3.3time元素 180

6.3.4wbr元素 181

6.4互動元素 181

6.4.1meter元素 181

6.4.2progress元素 183

6.4.3details元素 185

6.4.4summary元素 185

6.5音頻和視頻元素 186

6.5.1video元素 186

6.5.2audio元素 191

6.6標準屬性 193

6.6.1hidden屬性 193

6.6.2contenteditable屬性 194

6.6.3spellcheck屬性 195

6.7實戰——使用HTML5元素構建網頁 196

6.8本章習題 199

第7章HTML5新型表單的使用 201

7.1了解表單 202

7.1.1表單概述 202

7.1.2表單的基本結構 203

7.2表單元素 204

7.2.1datalist元素 204

7.2.2keygen元素 205

7.2.3output元素 206

7.3輸入類型 207

7.3.1email類型 207

7.3.2url類型 208

7.3.3number類型 209

7.3.4range類型 210

7.3.5datepickers類型 211

7.3.6search類型 212

7.3.7color類型 213

7.3.8tel類型 214

7.4表單屬性 214

7.4.1表單屬性 214

7.4.2input屬性 217

7.5實戰——修改用戶個人資料 223

7.6表單驗證 225

7.6.1表單驗證概述 226

7.6.2checkValidity()驗證 226

7.6.3setCustomValidity()驗證 227

7.7本章習題 229

第8章HTML5操作頁面圖形 231

8.1了解canvas元素 232

8.1.1canvas歷史 232

8.1.2canvas元素 232

8.1.3CSS和canvas 233

8.1.4CanvasAPI 233

8.1.5瀏覽器支持情況 233

8.2繪製文本 235

8.2.1繪製普通文本 235

8.2.2繪製陰影文本 237

8.3繪製矩形 239

8.3.1用rect()方法繪製 239

8.3.2用fillRect()方法繪製 240

8.3.3用strokeRect()方法繪製 241

8.3.4用clearRect()方法清除 241

8.4繪製路徑 242

8.4.1路徑繪圖方法 242

8.4.2繪製基本圖形 243

8.4.3繪製圓形和扇形 245

8.4.4貝塞爾曲線 247

8.5圖形變換和組合 249

8.5.1圖形變形 249

8.5.2矩陣變換 252

8.5.3圖形組合 254

8.6繪製顏色漸變 256

8.6.1線性漸變 256

8.6.2徑向漸變 258

8.7圖片的常用操作 259

8.7.1drawImage()繪製 259

8.7.2createPattern()方法 261

8.7.3clip()方法 263

8.8實現動畫特效 264

8.8.1了解動畫 264

8.8.2實戰——繪製動態閃動線條 265

8.9本章習題 266

第9章HTML5的其他新特性 269

9.1檔案新增特性 270

9.1.1獲取多個檔案的信息 270

9.1.2新增的FileReader接口簡介 272

9.1.3使用FileReader接口讀取

檔案 273

9.1.4使用FileReader接口監聽事件 276

9.1.5檔案讀取時的異常處理 278

9.1.6實戰——實現檔案上傳 279

9.2拖放功能 282

9.2.1拖放API簡介 282

9.2.2拖放對象的方法和屬性 283

9.2.3實戰——模擬圖片刪除 285

9.3新增的客戶端數據存儲特性 288

9.3.1客戶端存儲對象簡介 288

9.3.2操作本地數據 289

9.3.3實戰——以JSON方式存取數據 293

9.4新增的本地資料庫特性 295

9.4.1HTML5本地資料庫簡介 296

9.4.2資料庫操作API 296

9.4.3實戰——實現基於資料庫的收藏夾管理 297

9.5跨文檔傳輸信息 301

9.6多執行緒 303

9.6.1認識HTML5多執行緒 304

9.6.2實戰——Worker對象的簡單套用 305

9.7獲取位置信息 307

9.7.1認識地圖API 307

9.7.2Position對象 308

9.8HTML5的離線快取特性 310

9.9本章習題 312

第10章CSS3快速入門 315

10.1了解CSS3 316

10.1.1CSS3發展概述 316

10.1.2CSS3的優缺點 316

10.1.3瀏覽器支持情況 317

10.2CSS3的新增顏色 319

10.2.1HSL屬性 319

10.2.2HSLA屬性 321

10.2.3RGBA屬性 323

10.2.4Opacity屬性 324

10.3CSS3新增的選擇器 326

10.3.1屬性選擇器 327

10.3.2結構化偽類選擇器 328

10.3.3目標偽類選擇器 329

10.3.4UI元素狀態偽類選擇器 329

10.3.5否定偽類 329

10.3.6通用兄弟選擇器 330

10.4CSS3的新增屬性 330

10.4.1框線屬性 330

10.4.2背景屬性 331

10.4.3文本屬性 331

10.4.4盒模型屬性 331

10.4.5用戶界面屬性 332

10.4.6新增的其他屬性 332

10.5實戰——以CSS3屬性製作漂亮按鈕 333

10.6本章習題 336

第11章CSS3新增的選擇器 337

11.1屬性選擇器 338

11.1.1E[att^=value]選擇器 338

11.1.2E[att$=value]選擇器 340

11.1.3E[att*=value]選擇器 340

11.2結構化偽類選擇器 341

11.2.1E:root選擇器 341

11.2.2E:nth-child(n)選擇器 341

11.2.3E:nth-last-child(n)選擇器 342

11.2.4E:nth-of-type(n)選擇器 343

11.2.5E:nth-last-of-type(n)選擇器 344

11.2.6E:last-child選擇器 345

11.2.7E:first-of-type選擇器 345

11.2.8其他選擇器 346

11.3目標偽類選擇器 346

11.4UI元素狀態偽類選擇器 347

11.4.1常用的選擇器 347

11.4.2E::selection選擇器 349

11.5否定偽類選擇器 350

11.6通用兄弟選擇器 350

11.7實戰——設計直觀的表單頁面 351

11.8本章習題 354

第12章CSS3頁面美化樣式 357

12.1CSS3頁面美化 358

12.2文本樣式 358

12.2.1新增樣式 358

12.2.2新增樣式的用法 359

12.3字型樣式 363

12.4背景樣式 366

12.4.1background-clip屬性 366

12.4.2background-origin屬性 366

12.4.3background-size屬性 366

12.5框線樣式 368

12.5.1box-shadow屬性 369

12.5.2border-image屬性 370

12.5.3border-radius屬性 372

12.6實戰——表格的藝術 374

12.7本章習題 376

第13章CSS3頁面布局樣式 377

13.1新增的多列布局屬性 378

13.1.1columns屬性 378

13.1.2column-width屬性 379

13.1.3column-count屬性 380

13.1.4column-gap屬性 381

13.1.5column-rule屬性 381

13.1.6column-span屬性 383

13.1.7column-fill屬性 383

13.2新增的盒模型屬性 383

13.2.1box-orient屬性 384

13.2.2box-direction屬性 385

13.2.3box-ordinal-group屬性 386

13.2.4box-flex屬性 387

13.2.5box-flex-group屬性 389

13.2.6box-pack屬性 389

13.2.7box-align屬性 391

13.2.8box-lines屬性 392

13.3新增的界面布局屬性 393

13.3.1box-sizing屬性 393

13.3.2resize屬性 395

13.3.3zoom屬性 396

13.3.4outline-offset屬性 397

13.3.5nav-index屬性 398

13.4本章習題 398

第14章CSS3動畫特效 401

14.1漸變特效 402

14.1.1線性漸變 402

14.1.2徑向漸變 406

14.2轉換 408

14.2.12D轉換 408

14.2.23D轉換 413

14.3過渡 416

14.3.1常用的單個屬性 416

14.3.2transition的簡寫屬性 418

14.4動畫 419

14.4.1動畫相關屬性 419

14.4.2@keyframes 420

14.5實戰——製作動畫海報圈 421

14.6本章習題 425

第15章HTML5+CSS3頁面案例 427

15.1JavaScript經典貪吃蛇 428

15.1.1案例分析 428

15.1.2JavaScript實現 428

15.1.3頁面美化 431

15.2jQuery導航特效 432

15.2.1jQuery簡介 432

15.2.2jQuery實現導航特效 433

15.3CSS3圖片特效 436

15.4其他頁面效果 439

15.4.1頁面懸浮廣告 439

15.4.2滑鼠特效 441