使用HTML和CSS開(kāi)發(fā)Web網(wǎng)站

目錄

理 論 部 分


第1章HTML概述與基本標(biāo)簽

1.1Web概述

1.2HTML超級(jí)文本標(biāo)記語(yǔ)言

1.2.1HTML簡(jiǎn)介

1.2.2HTML發(fā)展

1.2.3基本結(jié)構(gòu)

1.2.4編輯工具

1.3頁(yè)面主體背景設(shè)置

1.3.1設(shè)置網(wǎng)頁(yè)的背景顏色

1.3.2設(shè)置網(wǎng)頁(yè)的背景圖片

1.4常用的HTML標(biāo)簽

1.4.1換行標(biāo)簽

1.4.2字體標(biāo)簽

1.4.3段落排版標(biāo)簽

1.4.4字體樣式標(biāo)簽

1.4.5水平線標(biāo)簽

1.4.6標(biāo)題標(biāo)簽

1.4.7圖像標(biāo)簽

1.4.8超鏈接標(biāo)簽

總結(jié)

課后習(xí)題

第2章表格與列表

2.1表格基礎(chǔ)

2.1.1為什么要使用表格

2.1.2表格的基本結(jié)構(gòu)

2.1.3表格的基本語(yǔ)法

2.2跨行跨列的表格

2.2.1跨列

2.2.2跨行

2.2.3跨行、跨列

2.3表格的高級(jí)用法

2.4列表

2.4.1無(wú)序列表

2.4.2有序列表

2.4.3定義列表

2.4.4菜單列表

2.4.5目錄列表

2.5制作滾動(dòng)效果

2.5.1滾動(dòng)文字

2.5.2設(shè)置滾動(dòng)方向

2.5.3設(shè)置滾動(dòng)其他屬性

2.5.4滾動(dòng)圖片

2.6層

2.6.1層的基本概念

2.6.2插入層

總結(jié)

課后習(xí)題

第3章表單與表單元素

3.1表單

3.1.1表單的組成

3.1.2表單標(biāo)簽form/form

3.2表單元素

3.2.1 input /標(biāo)簽

3.2.2textarea/textarea標(biāo)簽

3.2.3select/select及option/option

3.2.4button/button標(biāo)簽

3.2.5label/label標(biāo)簽

3.2.6fieldset/fieldset及l(fā)egend/legend標(biāo)簽

3.3表單的屬性與表單的提交

3.3.1表單的屬性

3.3.2表單的提交

總結(jié)

課后習(xí)題

第4章框架集與框架

4.1框架與框架集的關(guān)系

4.1.1為何使用框架

4.1.2框架集的基本結(jié)構(gòu)

4.1.3框架集的屬性

4.1.4框架的屬性

4.2框架集的嵌套

4.3窗口間的關(guān)聯(lián)

4.4iframe內(nèi)嵌框架

4.4.1iframe的用法

4.4.2iframe的屬性

總結(jié)

課后習(xí)題

第5章CSS層疊樣式表

5.1CSS樣式表

5.1.1CSS是什么

5.1.2CSS的作用

5.2CSS樣式規(guī)則聲明

5.3選擇器的分類(lèi)

5.3.1標(biāo)簽選擇器

5.3.2類(lèi)選擇器

5.3.3ID選擇器

5.3.4偽類(lèi)選擇器

5.3.5偽元素選擇器

5.3.6上下文選擇器

5.3.7群組選擇器

5.4如何應(yīng)用樣式

5.4.1三種樣式表寫(xiě)法

5.4.2CSS樣式表的優(yōu)先級(jí)

總結(jié)

課后習(xí)題

第6章常用的CSS樣式

6.1顏色與背景

6.2文本

6.3字體

6.4邊框

6.5列表

6.6其他雜項(xiàng)

總結(jié)

課后習(xí)題

第7章Web標(biāo)準(zhǔn)與頁(yè)面布局基礎(chǔ)

7.1Web標(biāo)準(zhǔn)

7.1.1結(jié)構(gòu)標(biāo)準(zhǔn)

7.1.2表現(xiàn)標(biāo)準(zhǔn)

7.1.3行為標(biāo)準(zhǔn)

7.1.4CSS的驗(yàn)證

7.2XHTML

7.3CSS中的盒狀模型

7.3.1盒狀模型

7.3.2margin(外邊距)

7.3.3border(邊框)

7.3.4padding(內(nèi)邊距)

7.3.5寬高及實(shí)際占位

7.3.6溢出

7.4元素的定位

7.4.1CSS定位的原理

7.4.2絕對(duì)定位

7.4.3相對(duì)定位

7.4.4固定定位

7.5層次堆疊

總結(jié)

課后作業(yè)

第8章CSS實(shí)現(xiàn)典型布局

8.1浮動(dòng)

8.2清除浮動(dòng)

8.3實(shí)現(xiàn)典型布局

8.3.1一列式布局

8.3.2兩列式布局

8.3.3三列式布局

8.3.4三行三列式布局

8.4典型的局部布局

8.4.1divulli局部布局

8.4.2divdldtdd局部布局

總結(jié)

課后習(xí)題

第9章使用Dreamweaver制作網(wǎng)頁(yè)

9.1Dreamweaver簡(jiǎn)介

9.1.1DreamWeaver CS4的功能和特點(diǎn)

9.1.2Dreamweaver CS4的工作界面

9.2站點(diǎn)的創(chuàng)建與管理

9.2.1新建站點(diǎn)

9.2.2管理站點(diǎn)文件

9.3創(chuàng)建和編輯常見(jiàn)的網(wǎng)頁(yè)元素

9.4表格及列表操作

9.5表單及表單元素操作

總結(jié)

課后習(xí)題

第10章使用Dreamweaver管理樣式和模板

10.1管理樣式

10.2管理模板

總結(jié)

課后習(xí)題

上 機(jī) 部 分


上機(jī)1HTML概述與基本標(biāo)簽

第1階段指導(dǎo)

指導(dǎo)1使用文本編輯器創(chuàng)建和編寫(xiě)簡(jiǎn)單的網(wǎng)頁(yè)

指導(dǎo)2使用標(biāo)題標(biāo)簽和段落標(biāo)簽

指導(dǎo)3使用圖像標(biāo)簽

第2階段練習(xí)

練習(xí)1使用字體樣式標(biāo)簽

練習(xí)2使用超鏈接標(biāo)簽

練習(xí)3使用圖像成為超鏈接

上機(jī)2表格與列表

第1階段指導(dǎo)

指導(dǎo)1創(chuàng)建簡(jiǎn)單的表格

指導(dǎo)2單元格的合并

指導(dǎo)3無(wú)序列表

第2階段練習(xí)

練習(xí)1使用表格

練習(xí)2使用無(wú)序列表和有序列表嵌套

練習(xí)3使用復(fù)雜表格

上機(jī)3表單和表單元素

第1階段指導(dǎo)

指導(dǎo)1form和input標(biāo)簽的簡(jiǎn)單使用

指導(dǎo)2使用各種類(lèi)型的input元素

第2階段練習(xí)

練習(xí)1使用列表框和多文本框

練習(xí)2使用fieldset和legend標(biāo)簽

上機(jī)4框架集與框架

第1階段指導(dǎo)

指導(dǎo)1實(shí)現(xiàn)簡(jiǎn)單的框架集

指導(dǎo)2實(shí)現(xiàn)嵌套的框架集

第2階段練習(xí)

練習(xí)1使用框架的屬性

練習(xí)2使用浮動(dòng)框架

練習(xí)3實(shí)現(xiàn)復(fù)雜的框架集嵌套

上機(jī)5CSS層疊樣式表

第1階段指導(dǎo)

指導(dǎo)1使用HTML標(biāo)簽選擇器

指導(dǎo)2使用類(lèi)選擇器

第2階段練習(xí)

練習(xí)1使用ID選擇器和上下文選擇器

練習(xí)2使用偽類(lèi)選擇器

上機(jī)6常用的CSS樣式

第1階段指導(dǎo)

指導(dǎo)1使用顏色與背景屬性

指導(dǎo)2使用文本和字體屬性

指導(dǎo)3使用邊框?qū)傩?

指導(dǎo)4使用無(wú)序列表實(shí)現(xiàn)簡(jiǎn)單的菜單

第2階段練習(xí)

練習(xí)1設(shè)置超鏈接的裝飾線

練習(xí)2熟悉常用的CSS樣式屬性

上機(jī)7Web標(biāo)準(zhǔn)與頁(yè)面布局

第1階段指導(dǎo)

指導(dǎo)1模擬城市選擇器

指導(dǎo)2模擬掃描碼下載提示

第2階段練習(xí)

練習(xí)模擬職能類(lèi)別選擇器

上機(jī)8CSS實(shí)現(xiàn)典型布局

第1階段指導(dǎo)

指導(dǎo)1實(shí)現(xiàn)多行多列的復(fù)雜布局

指導(dǎo)2模擬構(gòu)建網(wǎng)站

第2階段練習(xí)

練習(xí)實(shí)現(xiàn)典型的局部布局

上機(jī)9使用Dreamweaver制作網(wǎng)頁(yè)

第1階段指導(dǎo)

指導(dǎo)1使用Dreamweaver創(chuàng)建表格

指導(dǎo)2使用Dreamweaver創(chuàng)建表單及表單元素

第2階段練習(xí)

練習(xí)使用Dreamweaver創(chuàng)建頁(yè)面

上機(jī)10使用Dreamweaver管理樣式和模板

第1階段指導(dǎo)

第2階段練習(xí)

練習(xí)使用Dreamweaver創(chuàng)建模板