HTML+CSS+DIV網(wǎng)頁(yè)設(shè)計(jì)與布局從入門到精通

第1篇 網(wǎng)頁(yè)結(jié)構(gòu)與Web標(biāo)準(zhǔn)
第1章 網(wǎng)頁(yè)的構(gòu)成與Web標(biāo)準(zhǔn)
1.1 什么是網(wǎng)頁(yè)
1.2 網(wǎng)頁(yè)的構(gòu)成
1.2.1 頁(yè)面顯示的信息
1.2.2 構(gòu)成頁(yè)面的結(jié)構(gòu)HTML
1.2.3 顯示效果的控制
1.3 Web標(biāo)準(zhǔn)的概念
1.3.1 什么是Web標(biāo)準(zhǔn)
1.3.2 頁(yè)面的內(nèi)容
1.3.3 頁(yè)面的結(jié)構(gòu)
1.3.4 頁(yè)面的表現(xiàn)
1.3.5 Web標(biāo)準(zhǔn)的優(yōu)勢(shì)
1.4 Web標(biāo)準(zhǔn)網(wǎng)站欣賞
1.5 小結(jié)
1.6 習(xí)題
第2章 使用CSS構(gòu)建頁(yè)面的原理
2.1 什么是CSS
2.2 CSS應(yīng)該定義在哪里
2.3 CSS的優(yōu)先等級(jí)
2.3.1 元素內(nèi)部的CSS
2.3.2 頁(yè)面頭部的CSS
2.3.3 外部的CSS
2.4 調(diào)用CSS樣式的優(yōu)先級(jí)
2.5 使用CSS控制表現(xiàn)效果帶來(lái)的好處
2.6 實(shí)例演練--一個(gè)簡(jiǎn)單的登錄頁(yè)面
2.6.1 效果圖的分析
2.6.2 頁(yè)面結(jié)構(gòu)部分的制作
2.6.3 CSS部分的編寫
2.7 小結(jié)
2.8 習(xí)題
第3章 CSS布局的一般步驟
3.1 分析和切割效果圖
3.1.1 分析效果圖
3.1.2 切分效果圖
3.1.3 整理切分圖像
3.2 制作頁(yè)面的結(jié)構(gòu)和內(nèi)容
3.2.1 確定頁(yè)面的內(nèi)容
3.2.2 制作頁(yè)面的結(jié)構(gòu)
3.3 添加表現(xiàn)部分
3.4 完成簡(jiǎn)單的交互行為
3.5 整站布局的步驟
3.6 小結(jié)
3.7 習(xí)題
第2篇 結(jié)構(gòu)語(yǔ)言HTML
第4章 HTML基礎(chǔ)
4.1 HTML頁(yè)面結(jié)構(gòu)
4.2 元素的書(shū)寫格式和屬性
4.2.1 元素的書(shū)寫格式
4.2.2 元素的屬性
4.3 HTML語(yǔ)法規(guī)范
4.4 選擇文檔類型
4.4.1 什么是文檔類型
4.4.2 選擇什么樣的DOCTYPE
4.5 名字空間
4.6 小結(jié)
4.7 習(xí)題
第5章 定義頁(yè)面頭部信息
5.1 頁(yè)面基礎(chǔ)元素--
5.1.1 控制文本的顯示方向
5.1.2 指定頁(yè)面的語(yǔ)言
5.2 頁(yè)面頭部元素--
5.3 顯示頁(yè)面標(biāo)題--
5.4 基本設(shè)置元素--
5.5 定義頁(yè)面的信息--
5.6 創(chuàng)建頁(yè)面的樣式--
5.7 鏈接元素--
5.7.1 指定鏈接路徑
5.7.2 鏈接樣式文件
5.7.3 制作收藏夾圖標(biāo)
5.8 腳本元素--
5.9 小結(jié)
5.10 習(xí)題
第6章 頁(yè)面主體元素的設(shè)置
6.1 頁(yè)面主體元素--
6.2 定義主體元素的背景和文本屬性
6.3 定義頁(yè)面主體元素的邊界
6.3.1 定義左邊界
6.3.2 定義上邊界
6.4 定義頁(yè)面主體元素的鏈接屬性
6.4.1 定義未訪問(wèn)過(guò)的鏈接屬性
6.4.2 定義已訪問(wèn)過(guò)的鏈接屬性
6.4.3 定義激活的鏈接屬性
6.5 設(shè)置頁(yè)面主體元素的樣式
6.5.1 在主體元素中使用樣式
6.5.2 在主體元素中調(diào)用樣式
6.6 使用背景音樂(lè)
6.7 小結(jié)
6.8 習(xí)題
第7章 使用文本元素
7.1 文本元素簡(jiǎn)介
7.2 使用區(qū)域元素--
7.2.1 區(qū)域元素的對(duì)齊
7.2.2 使用樣式
7.2.3 定義唯一標(biāo)記
7.2.4 取消自動(dòng)換行
7.3 使用段落元素--
7.4 使用標(biāo)題元素
7.5 使用基于內(nèi)容的文本元素
7.6 使用基于物理樣式的文本元素
7.7 使用文本的間隔和布局元素
7.8 使用水平分隔線元素--
7.9 小結(jié)
7.10 習(xí)題
第8章 使用圖像元素
8.1 圖像的格式
8.1.1 JPEG格式
8.1.2 GIF格式
8.2 圖像元素--
8.2.1 定義圖像元素的顯示大小
8.2.2 定義代替圖片的文本
8.2.3 定義圖像元素的邊框
8.2.4 定義圖像元素的對(duì)齊
8.2.5 定義圖像元素的邊距
8.3 小結(jié)
8.4 習(xí)題
第9章 使用表格元素
9.1 表格元素的基本構(gòu)成
9.2 表格元素的顯示效果
9.2.1 定義邊框
9.2.2 定義表格的大小
9.2.3 定義內(nèi)容的對(duì)齊
9.2.4 定義背景
9.2.5 定義邊框效果
9.2.6 定義單元格間距
9.2.7 定義單元格補(bǔ)白
9.2.8 制作邊框?yàn)?像素的表格
9.3 定義行元素的顯示效果
9.4 定義單元格的顯示效果
9.4.1 定義對(duì)齊
9.4.2 定義單元格的背景
9.4.3 定義單元格的大小
9.4.4 定義單元格的邊框
9.4.5 行和列的合并
9.5 表格中使用的其他元素
9.6 小結(jié)
9.7 習(xí)題
第10章 使用鏈接元素
10.1 鏈接元素簡(jiǎn)介
10.2 定義鏈接元素
10.2.1 指定路徑
10.2.2 顯示鏈接目標(biāo)
10.2.3 定義鏈接的熱鍵
10.2.4 定義當(dāng)前文檔中的鏈接
10.3 圖像中的鏈接
10.3.1 創(chuàng)建鏈接區(qū)域元素--
10.3.2 定義圖像內(nèi)鏈接的示例
10.4 小結(jié)
10.5 習(xí)題
第11章 使用列表和表單元素
11.1 列表元素的分類
11.1.1 無(wú)序列表元素--
11.1.2 有序列表元素--
11.1.3 列表?xiàng)l目元素--
11.1.4 定義列表元素--
11.2 表單元素概述
11.3 表單元素--
11.4 表單控件元素--
11.4.1 文本域
11.4.2 密碼區(qū)域
11.4.3 提交按鈕
11.4.4 復(fù)位按鈕
11.4.5 圖像按鈕
11.4.6 單擊按鈕
11.4.7 復(fù)選框
11.4.8 單選按鈕
11.4.9 隱藏區(qū)域
11.5 定義表單控件的效果
11.5.1 設(shè)置只讀屬性
11.5.2 設(shè)置不可用屬性
11.6 選擇列表元素--
11.7 按鈕元素--
11.8 文本區(qū)域元素--
11.9 表單標(biāo)記元素--
11.10 小結(jié)
11.11 習(xí)題
第3篇 表現(xiàn)語(yǔ)言CSS
第12章 CSS的語(yǔ)法基礎(chǔ)
12.1 CSS的基本寫法
12.2 選擇符
12.2.1 id選擇符
12.2.2 類選擇符
12.2.3 類型選擇符
12.2.4 偽類
12.2.5 子選擇符
12.2.6 群組選擇符
12.2.7 選擇符的優(yōu)先級(jí)
12.3 屬性
12.4 屬性值
12.4.1 長(zhǎng)度值
12.4.2 百分比值
12.4.3 顏色值
12.4.4 URL值
12.5 默認(rèn)值
12.6 繼承
12.7 小結(jié)
12.8 習(xí)題
第13章 控制元素的顯示效果
13.1 盒子模型的概念
13.1.1 塊元素和內(nèi)聯(lián)元素
13.1.2 元素寬度的計(jì)算
13.2 元素內(nèi)容的大小
13.2.1 定義寬度
13.2.2 定義高度
13.2.3 內(nèi)容與寬度、高度屬性的關(guān)系
13.2.4 定義最大和最小寬度
13.2.5 定義最大和最小高度
13.3 元素的背景
13.3.1 定義背景顏色
13.3.2 定義背景圖片
13.3.3 定義背景圖片的重復(fù)
13.3.4 定義背景圖片位置
13.3.5 定義背景圖片滾動(dòng)
13.3.6 定義背景的綜合效果
13.3.7 背景顏色和背景圖片的優(yōu)先級(jí)
13.4 元素的補(bǔ)白
13.4.1 定義頂部補(bǔ)白
13.4.2 定義右側(cè)補(bǔ)白
13.4.3 定義底部補(bǔ)白
13.4.4 定義左側(cè)補(bǔ)白
13.4.5 定義綜合補(bǔ)白
13.4.6 補(bǔ)白與背景的關(guān)系
13.5 元素的邊框
13.5.1 定義單側(cè)邊框樣式
13.5.2 定義單側(cè)邊框顏色
13.5.3 定義單側(cè)邊框?qū)挾?br /> 13.5.4 統(tǒng)一定義邊框樣式
13.5.5 統(tǒng)一定義邊框顏色
13.5.6 統(tǒng)一定義邊框?qū)挾?br /> 13.5.7 單側(cè)邊框綜合設(shè)置
13.5.8 定義邊框綜合效果
13.6 元素的邊界
13.6.1 定義單側(cè)邊界
13.6.2 定義邊界綜合效果
13.6.3 邊界與背景的關(guān)系
13.7 小結(jié)
13.8 習(xí)題
第14章 控制元素的位置
14.1 元素的定位
14.1.1 元素的定位屬性
14.1.2 邊偏移屬性
14.2 絕對(duì)定位
14.2.1 絕對(duì)定位與父元素
14.2.2 絕對(duì)定位與相鄰元素
14.3 相對(duì)定位
14.3.1 相對(duì)定位元素位置的確定
14.3.2 相對(duì)定位與相鄰元素
14.4 定位元素的層疊
14.4.1 層疊定位屬性
14.4.2 簡(jiǎn)單嵌套元素中的層疊定位
14.4.3 包含子元素的復(fù)雜層疊定位
14.5 定位屬性的優(yōu)勢(shì)和問(wèn)題
14.5.1 定位屬性的優(yōu)勢(shì)
14.5.2 絕對(duì)定位的問(wèn)題
14.5.3 相對(duì)定位的問(wèn)題
14.6 小結(jié)
14.7 習(xí)題
第15章 控制元素的布局
15.1 元素的浮動(dòng)
15.1.1 定義元素的浮動(dòng)效果
15.1.2 浮動(dòng)元素和固定元素的關(guān)系
15.1.3 浮動(dòng)的順序
15.2 浮動(dòng)的清除
15.3 內(nèi)容的剪切
15.4 溢出內(nèi)容的控制
15.4.1 總體溢出
15.4.2 單向溢出
15.5 元素的顯示方式
15.5.1 定義顯示方式
15.5.2 元素的隱藏
15.6 元素的可視性
15.6.1 定義可視性
15.6.2 可視性屬性與顯示方式屬性的關(guān)系
15.7 小結(jié)
15.8 習(xí)題
第16章 控制文本的顯示
16.1 控制字體的顯示
16.1.1 選擇字體
16.1.2 設(shè)置字體顏色
16.1.3 定義字體大小
16.1.4 定義字體樣式
16.1.5 加粗顯示
16.1.6 修飾字體
16.1.7 使用小型大寫字母
16.1.8 轉(zhuǎn)換大小寫
16.1.9 設(shè)置字母間隔
16.1.10 定義單詞間隔
16.1.11 定義行高
16.1.12 定義字體綜合顯示效果
16.2 控制文本的顯示
16.2.1 控制文本縮進(jìn)
16.2.2 控制文本空白
16.2.3 控制文本溢出
16.2.4 設(shè)置水平對(duì)齊
16.2.5 設(shè)置垂直對(duì)齊
16.2.6 定義文本流向
16.2.7 定義文本方向
16.2.8 對(duì)文本排序
16.2.9 設(shè)置單詞換行
16.2.10 設(shè)置文本斷開(kāi)換行
16.3 小結(jié)
16.4 習(xí)題
第17章 控制列表和表格元素的顯示
17.1 控制列表元素的顯示
17.1.1 定義列表符號(hào)
17.1.2 使用列表圖片
17.1.3 定義標(biāo)記位置
17.1.4 標(biāo)記位置屬性與列表高度
17.1.5 綜合定義列表的顯示效果
17.2 列表元素的補(bǔ)白和邊界
17.3 控制表格元素的顯示
17.3.1 合并邊框
17.3.2 定義表格邊框間距
17.3.3 定義表格標(biāo)題位置
17.3.4 設(shè)置表格的布局
17.4 小結(jié)
17.5 習(xí)題
第18章 控制其他元素的顯示
18.1 控制滾動(dòng)條的顯示
18.1.1 定義滾動(dòng)條三角箭頭的顏色
18.1.2 定義滑塊顏色
18.1.3 定義滾動(dòng)條亮邊框顏色
18.1.4 定義滾動(dòng)條的高亮顏色
18.1.5 定義滾動(dòng)條陰影顏色
18.1.6 定義滾動(dòng)條暗部陰影顏色
18.1.7 定義滾動(dòng)條背景顏色
18.1.8 定義滾動(dòng)條基準(zhǔn)色
18.1.9 定義滾動(dòng)條的顏色
18.2 控制光標(biāo)的顯示
18.3 控制打印的顯示
18.3.1 對(duì)象后插入分頁(yè)符號(hào)屬性
18.3.2 對(duì)象前插入分頁(yè)符號(hào)屬性
18.4 控制元素的縮放
18.5 控制鏈接的顯示
18.5.1 定義鏈接未訪問(wèn)的顯示效果
18.5.2 定義鏈接鼠標(biāo)懸停的顯示效果
18.5.3 定義鏈接激活的顯示效果
18.5.4 定義鏈接訪問(wèn)后的顯示效果
18.5.5 定義鏈接效果的順序
18.6 小結(jié)
18.7 習(xí)題
第4篇 CSS布局
第19章 關(guān)于整站樣式表的分析
19.1 站點(diǎn)頁(yè)面的分析
19.1.1 規(guī)劃樣式表的原則
19.1.2 規(guī)劃樣式表的方法
19.1.3 實(shí)例分析
19.2 站點(diǎn)二級(jí)頁(yè)面的制作
19.2.1 日志內(nèi)容頁(yè)面結(jié)構(gòu)的規(guī)劃
19.2.2 日志內(nèi)容頁(yè)面CSS部分的制作
19.2.3 日志列表頁(yè)的制作
19.3 小結(jié)
19.4 習(xí)題
第20章 關(guān)于標(biāo)準(zhǔn)的校驗(yàn)
20.1 為什么要進(jìn)行標(biāo)準(zhǔn)的校驗(yàn)
20.2 怎樣進(jìn)行標(biāo)準(zhǔn)的校驗(yàn)
20.2.1 XHTML校驗(yàn)的方法
20.2.2 CSS校驗(yàn)的方法
20.2.3 XHTML校驗(yàn)常見(jiàn)錯(cuò)誤
20.2.4 CSS校驗(yàn)常見(jiàn)錯(cuò)誤
20.3 實(shí)例頁(yè)面的校驗(yàn)
20.3.1 實(shí)例首頁(yè)的校驗(yàn)
20.3.2 一個(gè)二級(jí)頁(yè)面的校驗(yàn)
20.4 小結(jié)
20.5 習(xí)題
第21章 制作企業(yè)宣傳類網(wǎng)頁(yè)
21.1 企業(yè)宣傳類網(wǎng)頁(yè)介紹
21.1.1 企業(yè)宣傳類網(wǎng)頁(yè)的作用
21.1.2 企業(yè)宣傳類網(wǎng)頁(yè)的構(gòu)成及特點(diǎn)
21.2 效果圖的分析
21.2.1 界面設(shè)計(jì)分析
21.2.2 規(guī)劃頁(yè)面布局
21.3 切圖與劃分頁(yè)面內(nèi)容
21.3.1 隱藏頁(yè)面中的文本內(nèi)容
21.3.2 切取頁(yè)面中的背景
21.3.3 切取頁(yè)面中的內(nèi)容
21.3.4 保存各種圖片
21.4 頁(yè)面頭部及導(dǎo)航欄的布局
21.4.1 制作頭部的結(jié)構(gòu)代碼
21.4.2 定義頁(yè)面的相關(guān)信息
21.4.3 導(dǎo)入樣式表文件
21.4.4 頭部?jī)?nèi)容結(jié)構(gòu)分析
21.4.5 對(duì)頭部文件整體添加樣式
21.4.6 制作頁(yè)面logo和菜單部分
21.4.7 制作頁(yè)面的導(dǎo)航欄
21.4.8 制作頁(yè)面的Banner
21.5 制作新聞列表部分
21.5.1 制作新聞列表的結(jié)構(gòu)代碼
21.5.2 新聞列表的修飾
21.5.3 制作側(cè)欄欄目
21.6 頁(yè)面底部的布局設(shè)計(jì)
21.6.1 制作底部的結(jié)構(gòu)代碼
21.6.2 制作底部信息的顯示效果
21.7 制作二級(jí)頁(yè)面（公司新聞）
21.7.1 二級(jí)頁(yè)面效果圖的分析
21.7.2 切圖并制作素材圖片
21.7.3 分析二級(jí)頁(yè)面結(jié)構(gòu)和樣式
21.7.4 制作側(cè)欄欄目
21.7.5 制作新聞列表
21.8 小結(jié)
21.9 習(xí)題