Web前端技術

Web前端技術

《Web前端技術》是舒後編寫,電子工業出版社出版的書籍。 主要內容包括:網頁設計基礎知識;HTML的使用及HTML5新標籤的介紹;CSS基礎和套用、CSS3.0新特徵的使用; JavaScript腳本編程;本書的最後1章介紹Web前端設計的新技術——回響式網頁及目前流行的用於實現回響式網頁設計的Bootstrap前端框架的使用,通過案例詳敘了基於Bootstrap框架的回響式網站的設計與開發的完整實現過程。

圖書內容

本書全面、系統地介紹了網頁設計的核心技術——HTML、CSS和JavaScript,側重於基礎理論和實際運用,並結合技術的最新前沿知識。

主要內容包括:網頁設計基礎知識;HTML的使用及HTML5新標籤的介紹;CSS基礎和套用、CSS3.0新特徵的使用; JavaScript腳本編程;本書的最後1章介紹Web前端設計的新技術——回響式網頁及目前流行的用於實現回響式網頁設計的Bootstrap前端框架的使用,通過案例詳敘了基於Bootstrap框架的回響式網站的設計與開發的完整實現過程。

本書以“講清語法、學以致用”為指導思想,不僅著重介紹每個技術點的語法,更側重通過具體小實例來達到學以致用的目的。其作者結合多年講授這門課程的教學經驗,合理地組織教材內容,做到內容緊湊、實踐性強並結合技術的前沿知識。

目 錄

第1章 網頁設計基礎知識 1

1.1 相關知識 2

1.2 Web前端開發技術 5

1.2.1 認識HTML 5

1.2.2 認識CSS 6

1.2.3 認識JavaScript 7

第2章 HTML基礎 9

2.1 HTML的概念 10

2.2 HTML的基本語法 10

2.2.1 標籤 10

2.2.2 屬性 11

2.3 HTML的文檔結構 12

2.3.1 基本結構 12

2.3.2 書寫注意事項 12

2.4 HTML的頭部檔案和主體檔案 13

2.4.1 檔案頭部內容 13

2.4.2 主體內容 16

習題 19

第3章 網頁文字與排版設計 21

3.1 編輯網頁內容 22

3.1.1 添加文字 22

3.1.2 添加注釋 22

3.1.3 添加空格 23

3.2 文字效果與修飾 23

3.2.1 設定文字樣式 23

3.2.2 修飾文字 24

3.3 段落與排版 29

3.3.1 段落的標籤 30

3.3.2 換行 30

3.3.3 預格式化 32

3.3.4 居中顯示文字 33

3.3.5 插入水平線 33

3.3.6 設定段落縮進 34

3.4 建立列表 35

3.4.1 建立定義列表 35

3.4.2 建立無序列表 37

3.4.3 建立有序列表 39

3.4.4 建立嵌套列表 41

3.5 文字網頁綜合實例 41

習題 43

第4章 超連結的使用 45

4.1 超連結簡介 46

4.2 超連結的路徑 46

4.2.1 設定絕對路徑 46

4.2.2 設定相對路徑 46

4.2.3 設定根路徑 47

4.3 超連結的套用 47

4.3.1 超連結的建立 47

4.3.2 插入內部和外部連結 48

4.3.3 插入錨連結(書籤連結) 49

4.3.4 插入圖片連結 52

4.3.5 電子郵件連結 53

4.3.6 下載檔案的連結 54

4.4 設定圖像映射 55

4.5 其他連結 56

4.5.1 定義基準網址 56

4.5.2 框架的連結 57

4.6 綜合實例 57

習題 58

第5章 表格的使用 60

5.1 創建表格 61

5.1.1 表格的結構 61

5.1.2 表格的標題與表頭 62

5.2 設定表格屬性 64

5.2.1 設定表格的框線 64

5.2.2 設定框線樣式 65

5.2.3 設定表格的寬度和高度 67

5.2.4 設定表格的背景顏色 67

5.3 設定單元格 68

5.3.1 設定單元格水平對齊屬性 68

5.3.2 設定單元格垂直對齊 69

5.3.3 設定單元格間距和邊距 70

5.3.4 合併單元格 72

5.4 表格嵌套 74

5.5 綜合實例 75

習題 76

第6章 網頁框架設計 78

6.1 框架 79

6.1.1 框架的概念 79

6.1.2 框架的基本結構 80

6.2 框架的設定 80

6.2.1 框架的檔案屬性 80

6.2.2 設定框架的名稱 81

6.2.3 框架的框線 81

6.2.4 框架的滾動條 82

6.2.5 調整框架尺寸 83

6.2.6 設定框架邊緣寬度與高度 84

6.3 框架集的設定 85

6.3.1 框架集框線寬度 85

6.3.2 設定框架集框線顏色 86

6.3.3 框架的分割 87

6.4 框架的嵌套 88

6.5 不支持框架 88

6.6 浮動框架 90

6.7 設定框架的連結 91

6.7.1 普通框架添加連結 91

6.7.2 浮動框架添加連結 92

6.8 框架的綜合套用 94

習題 96

第7章 層的套用 98

7.1 創建層 99

7.2 層的屬性 99

7.2.1 層屬性的設定 99

7.2.2 層的框線 100

7.2.3 層框線的顏色 100

7.3 嵌套層 102

7.4 標籤的使用 102

7.5 綜合套用 103

習題 104

第8章 表單的使用 106

8.1 表單 107

8.1.1 基本概念 107

8.1.2 表單的屬性 107

8.2 輸入標籤 108

8.2.1 表單元素標記 108

8.2.2 文本框 108

8.2.3 密碼框 109

8.2.4 單選框、複選框 110

8.2.5 圖像域 111

8.2.6 隱藏域 112

8.2.7 多行文本域 113

8.2.8 按鈕 113

8.2.9 下拉選單和滾動列表 114

8.2.10 插入檔案域 115

8.3 表單綜合實例 117

習題 118

第9章 HTML5基本介紹 120

9.1 認識HTML5 121

9.1.1 HTML5的發展史 121

9.1.2 HTML5與HTML4的差異 121

9.1.3 HTML5廢除的標籤 122

9.2 HTML5的新功能 122

9.2.1 HTML5聲明 123

9.2.2 語義化標籤 123

9.3 新增標籤介紹 126

9.3.1 視頻標籤與屬性 126

9.3.2 音頻標籤與屬性 127

9.3.3 畫布標籤與屬性 128

9.3.4 表單屬性 129

9.4 Web存儲 137

9.4.1 Web存儲的兩種方法 137

9.4.2 Web存儲的優勢和意義 139

第10章 CSS語法基礎 140

10.1 CSS的簡介 141

10.1.1 CSS的發展史 141

10.1.2 CSS的定義 141

10.2 CSS的基本語法 142

10.3 CSS選擇符的類型 143

10.3.1 標記選擇符 143

10.3.2 組合選擇符 144

10.3.3 類選擇符 145

10.3.4 id選擇符 146

10.3.5 包含選擇符 148

10.3.6 偽類 149

10.4 選擇符的優先權 150

10.5 套用CSS樣式表 151

10.5.1 行內樣式 151

10.5.2 內嵌樣式 152

10.5.3 連結外部樣式 153

10.5.4 導入外部樣式 154

10.5.5 樣式表的優先權 155

習題 156

第11章 CSS設定文字與版式 158

11.1 字型屬性的設定 159

11.1.1 字型font-family 159

11.1.2 字號font-size 159

11.1.3 字型風格font-style 162

11.1.4 字型加粗font-weight 162

11.1.5 字型變體font-variant 162

11.1.6 綜合字型屬性font 163

11.2 文本的版式控制(文本排版) 164

11.2.1 設定首行縮進text-indent 164

11.2.2 設定首字下沉first-letter類 165

11.2.3 調整行高line-height 166

11.2.4 調整字元間距letter-spacing 168

11.2.5 調整單詞間距word-spacing 168

11.2.6 添加文字修飾text-decoration 169

11.2.7 設定文本對齊方式text-align和vertical-align 170

11.2.8 轉換英文大小寫text-transform 171

11.2.9 文本陰影text-shadow 172

習題 173

第12章 顏色和背景 174

12.1 顏色color 175

12.1.1 顏色名稱定義 175

12.1.2 顏色的十六進制定義 175

12.1.3 顏色的RGB函式定義 176

12.2 頁面背景background 176

12.2.1 設定背景顏色 176

12.2.2 設定背景圖片 177

12.2.3 設定重複背景圖片 179

12.2.4 設定滾動背景圖片 180

12.2.5 設定背景圖片位置 181

12.2.6 背景複合屬性background 183

12.2.7 設定背景尺寸 184

12.2.8 定義透明度 185

習題 186

第13章 CSS盒子模型 188

13.1 盒模型簡介 189

13.1.1 盒模型定義 189

13.1.2 DIV盒子 189

13.2 框線屬性 190

13.2.1 框線樣式屬性border-style 190

13.2.2 框線寬度屬性border-width 192

13.2.3 框線顏色屬性border-color 192

13.2.4 框線屬性的綜合設定 193

13.3 邊距屬性 194

13.3.1 內邊距padding 194

13.3.2 外邊距margin 195

13.4 圓角框線 199

習題 201

第14章 定位和布局 202

14.1 CSS元素定位 203

14.1.1 定位方式 203

14.1.2 設定位置top、bottom、right、left 203

14.1.3 圖層定位z-index屬性 206

14.1.4 使用浮動屬性 207

14.2 CSS布局屬性 207

14.2.1 可見性visibility 207

14.2.2 裁切clip 209

14.2.3 設定層大小width和height 210

14.2.4 溢出overflow 211

14.2.5 浮動float 212

14.2.6 清除浮動clear 213

14.3 其他頁面元素的設定 214

14.3.1 滑鼠特效 214

14.3.2 項目列表 216

習題 221

第15章 CSS濾鏡特效 223

15.1 概述 224

15.2 視覺濾鏡 225

15.2.1 Alpha濾鏡 225

15.2.2 Blur濾鏡 227

15.2.3 DropShadow濾鏡 228

15.2.4 Glow濾鏡 229

15.2.5 FlipH/FlipV濾鏡 230

15.2.6 Gray、Invert、Xray濾鏡 232

15.2.7 Chroma濾鏡 233

15.2.8 Wave濾鏡 235

15.2.9 Shadow濾鏡 237

15.2.10 Mask濾鏡 239

15.2.11 Emboss、Engrave濾鏡 240

習題 243

第16章 JavaScript基礎 244

16.1 JavaScript簡介 245

16.1.1 什麼是腳本語言 245

16.1.2 JavaScript、VBScript與Jscript 245

16.1.3 JavaScript語言的基本特點 245

16.1.4 在HTML中加入JavaScript代碼 246

16.1.5 一個簡單的實例 247

16.2 JavaScript基本語法 247

16.2.1 JavaScript的語句 247

16.2.2 數據類型 248

16.2.3 變數和常量 249

16.2.4 運算符和表達式 250

16.3 JavaScript流程控制語句 254

16.3.1 選擇語句 254

16.3.2 循環語句 259

16.3.3 其他語句 263

16.4 函式 264

16.4.1 函式的定義 264

16.4.2 函式的參數與返回值 265

習題 269

第17章 JavaScript的對象和事件 271

17.1 JavaScript的對象 272

17.1.1 JavaScript對象 272

17.1.2 JavaScript的內置對象和函式 272

17.1.3 瀏覽器內部對象 279

17.1.4 自定義對象 295

17.2 JavaScript的事件處理方式 297

17.2.1 JavaScript的常用事件 298

17.2.2 事件處理 299

習題 303

第18章 Web前端新技術——回響式網頁的設計與實現 305

18.1 回響式網頁技術 306

18.2 前端開發框架 306

18.3 Bootstrap框架 307

18.3.1 框架簡介 307

18.3.2 Bootstrap框架特點 307

18.3.3 Bootstrap環境安裝 310

18.4 基於數字媒體技術專業網站的設計與實現 311

18.4.1 美術設計 311

18.4.2 首頁的設計 312

18.4.3 Bootstrap導航 313

18.4.4 網頁內容區 313

18.4.5 頁腳導航區 317

18.5 小結 318

參考文獻 319

習題答案(選擇題) 320

相關詞條

熱門詞條

聯絡我們