內容介紹
《HTML+CSS網頁設計詳解》主要介紹頁面前端技術的開發,即常說的HTML+CSS+JavaScript,內容涉及面廣,從最基本的HTML標籤講起,再到CSS樣式和JavaScript腳本語言的使用,幾乎涉及網頁開發的所有重要知識。本書共分4篇。第1篇詳細介紹什麼是網頁、了解HTML的作用、HTML中的一些基本標籤、網頁圖片的使用、如何設定網頁顏色以及網頁連結的設定;第2篇詳細介紹CSS規則、表格的使用、如何創建框架和層以及頁面布局的方法;第3篇詳細介紹表單、腳本語言、JavaScript入門以及製作網頁所需要的工具;第4篇通過4個案例綜合介紹網頁開發的詳細過程,以提高讀者的實戰水平。書中提供了大量實例,供讀者實戰演練。另外,專門為本書錄製了大量的配套教學視頻,並提供書中的實例原始碼,以幫助讀者更好地學習本書內容。
本書適合所有想全面學習網頁開發技術的人員閱讀。對於經常做網頁開發的人員,更是一本不可多得的案頭必備參考書。
作者簡介
副研究員、高級電子商務師,高級硬體工程師,中國電子商務協會電子商務研究院副院長,兼任中國社會發展研究院研究員,中國電子商務協會專家,湖北省電子商務發展聯合會籌委會副秘書長,在多所重點高校擔任客座講師,負責講授電子商務專業本科及部分研究生課程。獲得中國社科院2009年“當前經濟形勢與企業發展研討會”一等獎。擔任項目負責人,主持省部級項目一個、行業標準一個,多箇中央企業電子商務建設重點項目,在專業核心期刊發表論文20於篇。
目錄
第1篇 頁面製作入門篇
1.1 什麼是網頁 2
1.1.1 網頁的概述 2
1.1.2 靜態網頁 3
1.1.3 動態網頁 4
1.1.4 開發動態頁面和靜態頁面的聯繫 5
1.2 開發網頁的工具 7
1.2.1 HTML頁面的開發工具 7
1.2.2 動態頁面的開發工具 8
1.3 使用網頁瀏覽器 9
1.3.1 網頁瀏覽器的工作原理 9
1.3.2 常用的兩種瀏覽器 10
1.4 HTML、XML和XHTML語言 11
1.4.1 超文本標記語言HTML 11
1.4.2 可擴展標識語言XML 12
1.4.3 可擴展超文本標識語言XHTML 12
1.5 編寫一個簡單的頁面 13
1.6 小結 14
1.7 本章習題 14
第2章 通過學習他人的網頁了解HTML
能做什麼 16
2.1 用記事本打開一個頁面 16
2.2 初識HTML 18
2.2.2 HTML文檔的結構 19
2.3 HTML文檔基本結構標籤的作用 21
2.3.1 給頁面一個聲明--樣本代碼 21
2.3.2 踏出製作頁面的第一步--開始
標籤<html> 22
2.3.3 頁面的"腦袋"--頭標籤和頭標籤的
對象 22
2.3.4 給頁面起名字--標題標籤<title> 25
2.3.5 頁面的"身體"--主體標籤<body> 26
2.3.6 美化HTML文檔 27
2.4 案例:製作第一個頁面 27
2.5 小結 29
2.6 本章習題 29
第3章 動手在網頁中寫些什麼 31
3.1 新舊方法對比 31
3.2 文本的排版格式 33
3.2.1 寫一行換一行 33
3.2.2 在頁面文本中空格 34
3.2.3 文本的段落要對齊 36
3.3 文本的屬性樣式 38
3.3.1 不一樣的文本字型大小 39
3.3.2 奇妙的特殊符號 41
3.3.3 給文本加標註 42
3.4 整齊的文本列表 43
3.4.1 無序列表 43
3.4.2 有序列表 44
3.4.3 定義列表 45
3.4.4 列表嵌套 46
3.5 製作一則通知 48
3.6 小結 50
3.7 本章習題 50
第4章 將圖像放入頁面中 52
4.1 圖像的基礎知識 52
4.1.1 最常用的圖像--點陣圖 53
4.1.2 在頁面中常用的點陣圖格式 53
4.1.3 奇妙的矢量圖 54
4.1.4 圖像的解析度 55
4.1.5 認識一些網頁中常用的BANNER尺寸 55
4.2 用圖像編織美麗的頁面 56
4.2.1 理解圖像路徑 56
4.2.2 像編輯文本對齊一樣在頁面中對齊圖像 57
4.2.3 圖像與文本的對齊方式 58
4.2.4 控制圖像與文本的距離 60
4.3 讓圖像變得更美觀 61
4.3.1 修改圖像的寬度和高度 61
4.3.2 不一樣的改變--給圖像添加框線 62
4.3.3 獨樹一幟的水平線 63
4.4 改變頁面的背景 64
4.5 案例:把寵物的照片放到網頁上去 65
4.6 小結 67
4.7 本章習題 67
第5章 讓網頁變得更絢麗 69
5.1 了解計算機語言下的顏色描述 69
5.2 讓頁面絢麗多彩 70
5.2.1 改變頁面背景顏色 70
5.2.2 改變頁面文本字型顏色 71
5.3 不尋常的圖像套用 72
5.3.1 會動的GIF圖像 72
5.3.2 圖像的透明通道 73
5.3.3 帶有透明通道圖像的套用 75
5.4 案例:修飾普通頁面 77
5.5 小結 78
5.6 本章習題 78
第6章 頁面連結 81
6.1 何為頁面連結 81
6.1.1 初識頁面連結 82
6.1.2 理解連結地址 83
6.2.1 基本的文本連結 84
6.2.2 基本的圖像連結 85
6.2.3 信箱地址連結 86
6.2.4 在同一頁面中快速查找信息 87
6.3 提高頁面連結的友好度 89
6.3.1 美觀連結的狀態 90
6.3.2 特殊的連結方式 92
6.3.3 熱點圖像區域的連結 93
6.4 在新視窗中顯示連結視窗 96
6.5 案例:製作普通連結的主頁 96
6.6 小結 99
6.7 本章習題 99
第2篇 頁面製作提高篇
第7章 CSS規則 104
7.1 如何學習CSS 104
7.2 CSS基本的規則寫法 107
7.2.1 基本的樣式表的寫法 107
7.2.2 使用類class和標誌id連結樣式表 108
7.2.3 創建選擇器 109
7.2.4 套用CSS樣式表 113
7.3 用CSS來修飾頁面文本 115
7.3.1 修飾頁面文本字型 115
7.3.2 文本的字號 116
7.3.3 文本段落行高 117
7.3.4 禁止文本自動換行 119
7.4 給頁面對象添加顏色 120
7.5 案例:使用CSS製作個人頁面 121
7.6 小結 123
7.7 本章習題 124
第8章 表格 126
8.1 理解頁面中的表格 126
8.2 普通表格的套用 126
8.2.1 製作普通表格 127
8.2.2 表格的基本屬性 128
8.2.3 合併單元格 130
8.2.4 表格標題 132
8.2.5 拆分表格 132
8.2.6 設定表格的列 133
8.3 修飾單元格 135
8.3.1 通過CSS修飾單元格的框線 135
8.3.2 合併相鄰單元格 137
8.4 編輯單元格中的內容 138
8.4.1 單元格中文本與單元格大小 138
8.4.2 修飾單元格中的內容 139
8.5 案例:製作球賽積分表 140
8.6 小結 143
8.7 本章習題 144
第9章 創建框架結構的頁面 146
9.1 創建視窗框架頁面 146
9.1.1 創建視窗框架的<frameset>和<frame>
標籤 147
9.1.2 橫向分割視窗 147
9.1.3 縱向分割視窗 148
9.1.5 將頁面放入視窗框架中 150
9.2 修飾框架的細節 151
9.2.1 給無法處理框架的瀏覽器注釋說明 151
9.2.2 固定框架的位置 152
9.2.3 框架中設定滾動條 152
9.3 修改框架框線的樣式 153
9.3.1 判定框線是否顯示 153
9.3.2 改變框線的表現效果 154
9.3.3 框線的邊距 155
9.4 框架集中頁面之間的連結 156
9.4.1 在指定的框架中打開連結 156
9.4.2 框架內的錨點連結 159
9.5 靈活的<iframe>框架 160
9.6 案例:制定自己的連結主頁 161
9.7 小結 163
9.8 本章習題 164
第10章 當CSS樣式表遇到層 166
10.1 理解塊級的意義 166
10.2 頁面中的層 167
10.2.1 行<span>和層<div> 168
10.2.3 層的疊加 170
10.3 框模型 171
10.3.1 理解框模型 171
10.3.2 空距padding屬性 173
10.3.3 框線border的擴展屬性 175
10.3.4 邊距(margin) 176
10.3.5 框模型的溢出 177
10.4 定製層的display屬性 178
10.5 CSS Hack 180
10.6 案例:簡單的CSS+DIV 182
10.7 小結 184
10.8 本章習題 184
第11章 進一步討論頁面布局的方法 187
11.1 頁面中的定位 187
11.1.1 靜態定位 187
11.1.3 絕對定位 189
11.1.4 固定定位 190
11.2 浮動層 190
11.3 CSS的新奇技術以及未來發展 192
11.3.1 圖像替換技術 193
11.3.2 CSS 3.0的新發展 195
11.3.3 實現圓角框模型 195
11.4 案例:有效地管理頁面布局 196
11.5 小結 202
11.6 本章習題 202
第3篇 動感頁面篇
第12章 神奇的表單 206
12.1.1 <script>標籤 208
12.1.2 創建表單 208
12.1.3 表單域 210
12.2 通過表單展示不一樣的頁面 210
12.2.1 input對象下的多種表單表現形式 210
12.2.2 text文本框的樣式表單 211
12.2.3 password輸入密碼的樣式表單 212
12.2.4 checkbox複選框的樣式表單 213
12.2.5 radio單選按鈕的樣式表單 214
12.2.6 submit提交數據的樣式表單 215
12.2.7 hidden隱藏域的樣式表單 216
12.2.8 image樣式的表單 217
12.2.9 file上傳檔案的樣式表單 217
12.3 textarea對象的表單 218
12.4 select對象的表單 219
12.5 表單域集合 222
12.6 案例:製作一個精美的由表單構成
的頁面 222
12.7 小結 227
12.8 本章習題 227
第13章 在網頁中加入神奇的效果 230
13.1 什麼是腳本語言 230
13.1.1 初識VBScript 230
13.1.2 學習JavaScript的起步 231
13.2 JavaScript和Java的區別 233
13.3 JavaScript的基本語法 233
13.3.1 JavaScript中的標識符和保留關鍵字 234
13.3.2 JavaScript語法的特殊規則 235
13.4 JavaScript的數據類型 235
13.4.1 常量 236
13.4.2 變數 236
13.4.3 數據類型轉換 237
13.4.5 表達式 239
13.5 流程控制 240
13.5.1 順序結構 240
13.5.2 選擇結構 241
13.5.3 循環結構 243
13.6 了解函式 245
13.7 案例:一個使用基本語法的
JavaScript例子 247
13.8 小結 250
13.9 本章習題 250
第14章 JavaScript入門 253
14.1 了解一下何為"對象" 253
14.1.1 JavaScript對象概述 253
14.1.2 DOM介紹 255
14.2 JavaScript中的數組 256
14.2.1 定義和運算元組 256
14.2.2 多維數組 259
14.3 內部對象 259
14.3.1 Math對象 260
14.3.2 Date對象 260
14.3.3 String對象 260
14.4 window對象 261
14.4.1 window對象屬性 261
14.4.2 window對象方法 264
14.4.3 window對象事件 267
14.5 document對象 269
14.5.1 document對象屬性 269
14.5.2 document對象方法 269
14.5.3 document對象事件 270
14.6 案例:一個運用JavaScript實現的
動態頁面 272
14.7 小結 275
14.8 本章習題 276
第15章 了解製作頁面的工具 278
15.1 可視化編輯頁面工具--
Dreamweaver 278
15.1.1 了解Dreamweaver CS6的界面 278
15.1.2 Dreamweaver的選單 280
15.2 神奇的"美工筆"--Photoshop 280
15.2.1 了解Photoshop的界面 280
15.2.2 Photoshop的使用技巧 281
15.3 網頁中的動畫--Flash 283
15.3.1 認識Flash檔案 283
15.3.2 在頁面中放入Flash檔案 283
15.3.3 製作Flash的軟體 286
15.3.4 Flash 8的選單 287
15.3.5 Flash 8的主要功能 287
15.3.6 Flash的常用互動技巧 287
15.4 案例:使用Dreamweaver製作
頁面 289
15.5 小結 291
15.6 本章習題 291
第4篇 頁面實戰篇
第16章 綜合案例1:製作主流網站界面 294
16.1 構思基礎的布局 294
16.2 設計基礎模組的樣式表 295
16.3 完善網站的子模組 297
16.3.1 網站的導航欄 297
16.3.2 頁面的側欄 298
16.4 最終頁面 300
16.5 小結 301
第17章 綜合案例2:設計複雜頁面 302
17.1 頁面的框架布局 302
17.1.1 定位頁面的內容 302
17.1.2 頁面初級布局的代碼 303
17.2 細化頁面的局部 304
17.2.1 intro部分 304
17.2.2 頁面的左側部分 306
17.2.3 頁面的右側欄主體部分和頁腳 309
17.3 小結 312
第18章 綜合案例3:製作英文網站 313
18.1 分析效果圖 313
18.2 切圖 314
18.2.1 製作首頁的切圖 315
18.2.2 二級頁面的切圖 316
18.3 製作站點首頁頭部 317
18.3.1 首頁頭部的信息和基礎樣式的製作 317
18.3.2 首頁頭部的分析 318
18.3.3 首頁頭部結構的製作 318
18.3.4 首頁頭部CSS代碼的編寫 319
18.4 製作首頁的主體部分 321
18.4.1 分析主體部分效果圖 321
18.4.2 製作主體左側部分的結構 322
18.4.3 製作主體左側部分的樣式 324
18.4.4 製作主體中間部分的結構 327
18.4.5 製作主體中間部分的樣式 328
18.4.6 製作主體右側部分的結構 331
18.4.7 製作主體右側部分的樣式 332
18.5 製作首頁的底部 334
18.6 二級頁面的製作 336
18.6.1 分析二級頁面的效果圖 336
18.6.2 製作二級頁面中間內容部分的結構 336
18.6.3 製作二級頁面中間內容部分的樣式 337
18.6.4 製作二級頁面右側部分的結構 339
18.6.5 製作二級頁面右側部分的樣式 340
18.8 小結 341
第19章 綜合案例4:使用Dreamweaver
製作中文網站 342
19.1 分析效果圖 342
19.2 製作首頁的切圖 343
19.3 製作站點首頁頭部 345
19.3.1 首頁頭部的信息和基礎樣式的製作 345
19.3.2 首頁頭部的分析 348
19.3.3 首頁頭部logo和banner部分的製作 348
19.3.4 導航列表的製作 351
19.4 製作首頁的主體部分 354
19.4.1 分析主體部分效果圖 354
19.4.2 製作主體部分的父元素 355
19.4.3 製作主體左側部分的樣式 356
19.4.4 製作主體右側內容中"關於我們"的
部分 359
19.4.5 製作"今日新聞"部分 362
19.4.6 製作"證券點撥"和"證券時評"
部分 364
19.4.7 製作"合作夥伴"部分 366
19.5 製作首頁的底部 368
19.6 二級頁面的製作 369
19.7 小結 371
附錄1 HTML 4.0快速參考 372
附錄2 CSS中支持的顏色名稱 387
網站開發非常之旅
Android移動網站開發詳解 ISBN:9787302344308
ASP.NET項目開發詳解 ISBN:9787302345725
iOS移動網站開發詳解 ISBN:9787302344858
Java Web開發技術詳解ISBN:9787302344100
PHP網路編程技術詳解 ISBN:9787302343189
ASP.NET網路編程技術詳解 ISBN:9787302342540
HTML+CSS網頁設計詳解 ISBN:9787302343202
Linux伺服器配置與管理ISBN:9787302344865
CSS+DIV網頁布局技術詳解 ISBN:9787302345732
Dreamweaver CS6網頁設計與製作詳解 ISBN:9787302344339