零基礎(chǔ)學(xué)編程：零基礎(chǔ)學(xué)HTML+CSS

前言
第一篇 HTML基礎(chǔ)知識
第1章 認(rèn)識HTML語言
1.1 HTML與網(wǎng)頁
1.1.1 認(rèn)識HTML語言
1.1.2 靜態(tài)網(wǎng)頁
1.1.3 動態(tài)網(wǎng)頁
1.2 HTML標(biāo)記的組成
1.2.1 單標(biāo)記
1.2.2 雙標(biāo)記
1.3 創(chuàng)建第一張網(wǎng)頁
1.4 瀏覽HTML的瀏覽器兼容
1.5 編寫HTML的工具
1.5.1 Aptana代碼提示工具
1.5.2 Dreamweaver網(wǎng)頁開發(fā)工具
1.6 小結(jié)
1.7 習(xí)題
第2章 常用HTML標(biāo)記和格式
2.1 設(shè)置正文的標(biāo)題
2.1.1 標(biāo)題設(shè)置的語法
2.1.2 標(biāo)題設(shè)置經(jīng)典案例--字號由大到小
2.2 設(shè)置段落
2.2.1 段落標(biāo)記
2.2.2 段落中的空格
2.2.3 強(qiáng)制換行
2.3 給代碼添加注釋
2.4 文字的修飾
2.4.1 粗體與斜體
2.4.2 下劃線與刪除線
2.4.3 上標(biāo)與下標(biāo)
2.5 HTML標(biāo)記和格式實(shí)例
2.5.1 標(biāo)題用h1
2.5.2 設(shè)置每一行為一段落
2.5.3 粗體和刪除線
2.5.4 加上化學(xué)元素和數(shù)學(xué)平方根
2.6 小結(jié)
2.7 習(xí)題
第3章 字體標(biāo)記
3.1 設(shè)置字體大小
3.2 設(shè)置字體顏色
3.3 設(shè)置標(biāo)題字體樣式
3.3.1 設(shè)置標(biāo)題的字體大小
3.3.2 設(shè)置字體的大小和顏色
3.4 物理字體和邏輯字體
3.4.1 物理字體
3.4.2 邏輯字體
3.5 字體標(biāo)記實(shí)例
3.5.1 插入字體
3.5.2 將字體顏色設(shè)置為紅色
3.5.3 將文字設(shè)置為標(biāo)題h1
3.5.4 將文字設(shè)置為斜體并加刪除線
3.5.5 設(shè)置字體為
3.6 小結(jié)
3.7 習(xí)題
第4章 文字布局
4.1 行的控制
4.1.1 換行控制
4.1.2 不換行控制
4.2 文字對齊
4.3 段落設(shè)置
4.4 列表
4.4.1 無序列表
4.4.2 有序列表
4.5 用其他方式修飾文本
4.5.1 欲格式化文本
4.5.2 計(jì)算機(jī)輸出格式
4.6 文字布局實(shí)例
4.6.1 設(shè)置文字換行與不換行
4.6.2 設(shè)置文字對齊
4.6.3 顯示列表
4.6.4 在網(wǎng)頁中顯示源代碼
4.7 制作滾動文字
4.7.1 設(shè)置文字滾動
4.7.2 設(shè)置文字滾動的方向
4.7.3 設(shè)置文字滾動的速度和形式
4.8 小結(jié)
4.9 習(xí)題
第5章 圖像和鏈接
5.1 圖像的基本語法
5.1.1 在網(wǎng)頁中插入圖像
5.1.2 圖像無法顯示時(shí)的提示信息
5.1.3 控制圖像的大小
5.2 圖像和文字對齊
5.3 圖像的邊框
5.4 圖像映射圖
5.5 圖像的應(yīng)用實(shí)例
5.5.1 在網(wǎng)頁上引入圖像標(biāo)記
5.5.2 設(shè)置圖像參數(shù)alt
5.5.3 給圖像設(shè)置超鏈接
5.5.4 設(shè)置圖像的邊框
5.5.5 設(shè)置文本與圖像對齊
5.5.6 設(shè)置圖像的映射圖
5.6 文字鏈接
5.6.1 最簡單的文字鏈接
5.6.2 超鏈接網(wǎng)頁的打開方式
5.6.3 鏈接的注釋
5.7 圖片鏈接
5.8 錨點(diǎn)鏈接
5.9 郵箱地址鏈接
5.10 相對路徑與絕對路徑
5.10.1 相對路徑
5.10.2 絕對路徑
5.11 鏈接應(yīng)用實(shí)例
5.11.1 在網(wǎng)頁中做文字鏈接
5.11.2 給圖片設(shè)置超鏈接
5.11.3 設(shè)置錨點(diǎn)鏈接
5.11.4 郵箱鏈接
5.12 小結(jié)
5.13 習(xí)題
第6章 表單
6.1 表單概述
6.1.1 表單的用途
6.1.2 表單的結(jié)構(gòu)
6.1.3 表單的基本語法
6.1.4 表單的數(shù)據(jù)傳遞方式
6.2 文本框和密碼框
6.2.1 文本框
6.2.2 密碼框
6.3 單選框和復(fù)選框
6.3.1 單選框
6.3.2 復(fù)選框
6.4 下拉列表與文本域
6.4.1 下拉列表
6.4.2 文本域
6.5 按鈕
6.6 圖像域、文件域和隱藏域
6.7 表單實(shí)例
6.7.1 插入表單
6.7.2 添加文本框和密碼框
6.7.3 添加單選框和復(fù)選框
6.7.4 添加下拉列表和文本域
6.7.5 在表單中添加提交按鈕
6.8 小結(jié)
6.9 習(xí)題
第7章 表格
7.1 頁面中的表格
7.1.1 表格的外觀
7.1.2 表格的基本語法
7.2 跨多行、多列表元
7.2.1 跨多行表元
7.2.2 跨多列表元
7.3 設(shè)置表格大小
7.3.1 設(shè)置表格邊框
7.3.2 設(shè)置表格高度和寬度
7.4 表格內(nèi)文字對齊
7.5 表格在網(wǎng)頁中對齊
7.6 表格實(shí)例
7.6.1 表格中嵌入表格
7.6.2 設(shè)置跨行和跨列
7.7 小結(jié)
7.8 習(xí)題
第8章 框架
8.1 用框架靈活地組織網(wǎng)頁
8.1.1 框架在網(wǎng)站中的作用
8.1.2 框架的結(jié)構(gòu)分析
8.1.3 框架的基本語法
8.2 框架分欄
8.2.1 框架垂直分欄
8.2.2 框架水平分欄
8.3 框架的常用屬性
8.3.1 設(shè)置不可調(diào)節(jié)框架大小
8.3.2 瀏覽器不支持框架
8.3.3 設(shè)置框架邊框
8.3.4 設(shè)置滾動條
8.4 框架鏈接
8.4.1 導(dǎo)航框架
8.4.2 內(nèi)聯(lián)框架
8.5 框架實(shí)例
8.5.1 在網(wǎng)頁中插入框架
8.5.2 設(shè)置框架的滾動條和邊框
8.5.3 設(shè)置不支持框架文字
8.5.4 設(shè)置框架導(dǎo)航鏈接
8.6 小結(jié)
8.7 習(xí)題
第9章 網(wǎng)頁中的動態(tài)圖文和多媒體
9.1 移動屬性的基本語法
9.2 文字的移動
9.3 圖片的移動
9.4 設(shè)置對象的移動
9.4.1 文本移動的方向
9.4.2 文本的滾動循環(huán)
9.4.3 文本的移動速度
9.4.4 應(yīng)用文本的全部移動標(biāo)記
9.5 移動實(shí)例--電影結(jié)束效果
9.6 網(wǎng)頁多媒體
9.6.1 網(wǎng)頁多媒體的基本語法
9.6.2 設(shè)置自動播放
9.6.3 設(shè)置多媒體循環(huán)播放
9.6.4 設(shè)置面板的隱藏
9.6.5 設(shè)置面板的大小
9.6.6 設(shè)置對齊方式
9.7 網(wǎng)頁多媒體實(shí)例--在網(wǎng)頁中播放視頻
9.7.1 引入視頻文件
9.7.2 設(shè)置多媒體為非自動播放
9.7.3 設(shè)置多媒體無循環(huán)播放
9.7.4 設(shè)置控制面板的大小
9.8 小結(jié)
9.9 習(xí)題
第二篇 DIV＋CSS布局
第10章 用DIV布局
10.1 DIV與TABLE布局比較
10.1.1 DIV簡介
10.1.2 DIV與TABLE的區(qū)別
10.2 如何用DIV布局
10.2.1 設(shè)置DIV選擇符
10.2.2 設(shè)置CSS修飾DIV效果
10.2.3 設(shè)置DIV的背景顏色
10.3 使用DIV注意事項(xiàng)
10.4 認(rèn)識SPAN
10.4.1 設(shè)置DIV選擇符
10.4.2 何時(shí)用SPAN
10.5 DIV與SPAN的區(qū)別
10.5.1 默認(rèn)寬度不同
10.5.2 塊元素與行內(nèi)元素
10.6 DIV與SPAN實(shí)例--多層布局
10.7 小結(jié)
10.8 習(xí)題
第11章 DIV與CSS結(jié)合
11.1 用CSS控制DIV
11.2 CSS文件鏈接
11.2.1 內(nèi)聯(lián)定義
11.2.2 鏈接內(nèi)部CSS
11.2.3 鏈接外部CSS
11.3 DIV+CSS布局實(shí)例
11.3.1 確定布局
11.3.2 定義body樣式
11.3.3 定義主要的DIV
11.3.4 設(shè)置層居中
11.4 小結(jié)
11.5 習(xí)題
第三篇 CSS部分
第12章 CSS的基礎(chǔ)知識
12.1 CSS簡介
12.2 CSS文件鏈接方式
12.3 選擇符
12.4 偽類
12.5 注解
12.6 單位
12.7 編寫CSS的工具
12.7.1 打開CSS工具軟件
12.7.2 新建CSS文件
12.7.3 另存為CSS文件
12.7.4 打開Aptana工具
12.7.5 在菜單欄中新建CSS文件
12.8 CSS與瀏覽器的兼容性
12.9 CSS基礎(chǔ)實(shí)例
12.9.1 在Aptana中新建網(wǎng)頁
12.9.2 在Aptana中新建CSS文件
12.9.3 鏈接CSS文件到HTML頁面中
12.9.4 用不同的瀏覽器測試頁面
12.10 小結(jié)
12.11 習(xí)題
第13章 字體設(shè)置和文本設(shè)置
13.1 文字的字體
13.1.1 字體的復(fù)合屬性
13.1.2 字體顏色
13.1.3 字體大小
13.1.4 字體重量
13.1.5 字體類型
13.2 行距
13.3 設(shè)置文本間距與間隔
13.3.1 文本間距
13.3.2 文本間隔
13.4 字體實(shí)例--字體花樣
13.4.1 加入字體名字
13.4.2 加入CSS控制字體
13.4.3 設(shè)置行距
13.4.4 設(shè)置文本間隔
13.5 字母大小寫轉(zhuǎn)換
13.6 文本修飾
13.7 空格處理方式
13.8 設(shè)置文本垂直與水平對齊
13.8.1 文本垂直對齊
13.8.2 文本水平對齊
13.9 文本縮進(jìn)
13.10 文本設(shè)置--給段落設(shè)置縮進(jìn)
13.10.1 對DIV布局
13.10.2 設(shè)置文本首行縮進(jìn)
13.11 小結(jié)
13.12 習(xí)題
第14章 設(shè)置背景和尺寸
14.1 背景的基本語法
14.2 設(shè)置背景顏色
14.3 設(shè)置背景圖像
14.3.1 設(shè)置背景圖像滾動
14.3.2 設(shè)置背景圖像的位置
14.3.3 設(shè)置背景圖像的鋪排
14.4 背景實(shí)例
14.4.1 設(shè)置層背景為綠色
14.4.2 設(shè)置層背景圖像
14.4.3 設(shè)置背景為不鋪排
14.4.4 設(shè)置背景圖像位置
14.5 設(shè)置尺寸
14.5.1 設(shè)置寬度
14.5.2 設(shè)置高度
14.6 尺寸實(shí)例--設(shè)置層居中
14.6.1 尺寸實(shí)例手把手
14.6.2 設(shè)置層居中
14.7 小結(jié)
14.8 習(xí)題
第15章 設(shè)置外邊距和內(nèi)邊距
15.1 外邊距的基本語法
15.2 外邊距的四邊設(shè)置
15.2.1 頂端外邊距的用法
15.2.2 右端外邊距的用法
15.2.3 底端外邊距的用法
15.2.4 左端外邊距的用法
15.3 外邊距實(shí)例--設(shè)置層與層的距離
15.3.1 層與層的距離效果
15.3.2 對層布局
15.3.3 設(shè)置層的尺寸
15.3.4 設(shè)置層漂移
15.3.5 設(shè)置層與層之間的間隔
15.4 內(nèi)邊距的基本語法
15.5 內(nèi)邊距的四邊屬性
15.5.1 頂端內(nèi)邊距的用法
15.5.2 右端內(nèi)邊距的用法
15.5.3 底端內(nèi)邊距的用法
15.5.4 左端內(nèi)邊距的用法
15.6 內(nèi)邊距實(shí)例
15.6.1 設(shè)置頂部內(nèi)邊距
15.6.2 設(shè)置其他位置的內(nèi)邊距
15.6.3 用復(fù)合屬性padding設(shè)置內(nèi)邊距
15.7 小結(jié)
15.8 習(xí)題
第16章 設(shè)置對象邊框
16.1 邊框的基本語法
16.2 邊框顏色
16.3 邊框樣式
16.4 邊框?qū)挾?br />16.5 對象的四個(gè)邊框
16.5.1 設(shè)置頂端邊框的屬性
16.5.2 設(shè)置右端邊框的屬性
16.5.3 設(shè)置底端邊框的屬性
16.5.4 設(shè)置左端邊框的屬性
16.6 邊框?qū)嵗?-多層邊框
16.6.1 設(shè)置單層邊框
16.6.2 設(shè)置多層邊框
16.7 小結(jié)
16.8 習(xí)題
第17章 定位
17.1 定位的基本語法
17.2 設(shè)置對象的層疊順序
17.3 設(shè)置對象的邊框位置
17.4 定位實(shí)例--圓角制作
17.4.1 相對定位實(shí)例
17.4.2 絕對定位實(shí)例
17.4.3 實(shí)例--圓角制作
17.5 小結(jié)
17.6 習(xí)題
第18章 用CSS控制列表和表格
18.1 列表的基本語法
18.2 設(shè)置列表的圖像
18.3 設(shè)置列表的文本排列
18.4 列表的預(yù)設(shè)標(biāo)記
18.5 列表實(shí)例
18.5.1 設(shè)置列表圖像文字內(nèi)顯示
18.5.2 設(shè)置列表樣式為空心圓
18.5.3 設(shè)置文本外自定義列表圖像
18.6 控制表格的基本語法
18.7 設(shè)置表格邊框獨(dú)立或合并
18.8 設(shè)置表格布局的算法
18.9 CSS控制表格實(shí)例
18.9.1 布局好表格
18.9.2 表格邊框獨(dú)立和合并
18.9.3 設(shè)置表格算法為自動和固定
18.10 小結(jié)
18.11 習(xí)題
第19章 滾動條和布局
19.1 滾動條
19.1.1 滾動條的基本語法
19.1.2 設(shè)置滾動條亮邊框顏色
19.1.3 設(shè)置3D界面亮邊顏色和表面顏色
19.1.4 設(shè)置滾動條方向箭頭顏色
19.1.5 設(shè)置滾動條3D界面暗邊顏色和暗邊框顏色
19.1.6 設(shè)置滾動條基準(zhǔn)顏色和拖動區(qū)域顏色
19.2 層的漂移
19.2.1 設(shè)置層的漂移
19.2.2 清除層的漂移范圍
19.3 設(shè)置層的可視區(qū)域
19.4 內(nèi)容超過層大小時(shí)
19.5 鼠標(biāo)指針的不同表示
19.6 設(shè)置對象可見性
19.6.1 設(shè)置對象是否隱藏
19.6.2 設(shè)置對象是否顯示
19.7 小結(jié)
19.8 習(xí)題
第20章 選擇符
20.1 通配選擇符
20.2 類型選擇符
20.3 包含選擇符
20.4 布局常用選擇符
20.4.1 ID選擇符
20.4.2 類選擇符
20.5 分組選擇符
20.6 偽類
20.7 偽類的四種狀態(tài)
20.7.1 訪問鏈接的狀態(tài)
20.7.2 鼠標(biāo)光標(biāo)置于其上的狀態(tài)
20.7.3 獲得焦點(diǎn)的狀態(tài)
20.7.4 訪問過后的狀態(tài)
20.8 CSS中的單位
20.8.1 長度單位
20.8.2 顏色單位
20.9 小結(jié)
20.10 習(xí)題
第四篇 實(shí)踐部分
第21章 游戲網(wǎng)站布局
21.1 網(wǎng)站主頁規(guī)劃
21.2 用DIV+CSS布局
21.2.1 實(shí)現(xiàn)頁面頭部
21.2.2 實(shí)現(xiàn)中間部分
21.2.3 實(shí)現(xiàn)頁面底部
21.3 加入文字
21.4 調(diào)整全頁面的兼容性
21.5 小結(jié)
第22章 企業(yè)網(wǎng)站布局
22.1 企業(yè)主頁規(guī)劃
22.2 對網(wǎng)頁布局
22.2.1 將頁面用DIV布局出框圖
22.2.2 用CSS實(shí)現(xiàn)頁面頭部
22.2.3 用CSS實(shí)現(xiàn)頁面體
22.3 添加文本等信息
22.4 調(diào)整全頁面和瀏覽器兼容
22.5 其他二級頁面模塊制作
22.6 小結(jié)
第23章 博客主要頁面布局
23.1 博客網(wǎng)站主頁規(guī)劃
23.1.1 分析主頁需求
23.1.2 確定內(nèi)容模塊
23.1.3 畫出效果圖
23.2 用DIV布局框圖
23.2.1 頁眉
23.2.2 實(shí)現(xiàn)內(nèi)容模塊
23.2.3 頁腳
23.3 CSS實(shí)現(xiàn)框圖
23.3.1 實(shí)現(xiàn)內(nèi)容模塊
23.3.2 實(shí)現(xiàn)整頁效果
23.4 添加圖片
23.5 加入文字
23.6 調(diào)整全頁面
23.7 其他頁面布局
23.8 小結(jié)
第24章 面試題
面試題1 DIV與SPAN的區(qū)別
面試題2 HTML的框架是什么
面試題3 CSS引入的方式有哪些
面試題4 前端頁面有哪三層構(gòu)成，各層的作用是什么
面試題5 常見的瀏覽器的內(nèi)核有哪些
面試題6 img元素的alt text屬性和title屬性有什么不同
面試題7 document.body和document.documentElement有什么不同
面試題8 XHTML和DHTML有什么區(qū)別
面試題9 寫出實(shí)現(xiàn)效果所需的CSS代碼
面試題10 寫出一段左邊固定、右邊隨電腦屏幕浮動而變動的HTML+CSS代碼
面試題11 寫一段兩個(gè)DIV交叉重疊的CSS樣式
面試題12 怎樣使一個(gè)層垂直居中位于瀏覽器中
面試題13 Firefox嵌套DIV標(biāo)簽居中問題的處理方法
面試題14 用純CSS實(shí)現(xiàn)帶下拉菜單的二級橫向?qū)Ш讲藛?br />面試題15 在網(wǎng)頁制作中為什么要使用CSS技術(shù)
面試題16 CSS+DIV開發(fā)Web頁面的優(yōu)勢有哪些
面試題17 實(shí)現(xiàn)兩列高度自適應(yīng)的CSS代碼