DIV CSS布局與樣式之網(wǎng)站設(shè)計(jì)基礎(chǔ)目錄

時(shí)間：2023-06-20 22:12:01 | 來源：營(yíng)銷百科

時(shí)間：2023-06-20 22:12:01 來源：營(yíng)銷百科

DIV CSS布局與樣式之網(wǎng)站設(shè)計(jì)基礎(chǔ)目錄：第1章網(wǎng)頁與網(wǎng)站的常識(shí)

1.1互聯(lián)網(wǎng)常識(shí)

1.1.1組成網(wǎng)站的要素

1.1.2網(wǎng)站域名

1.1.3域名解析

1.1.4網(wǎng)站空間

1.1.5虛擬主機(jī)

1.2網(wǎng)頁常識(shí)

1.2.1網(wǎng)頁的結(jié)構(gòu)描述語言HTML

1.2.2 XHTML和HTML的區(qū)別

1.2.3網(wǎng)頁的分類

1.2.4網(wǎng)頁的源代碼

1.3網(wǎng)站常識(shí)

1.3.1網(wǎng)站開發(fā)語言

1.3.2動(dòng)態(tài)網(wǎng)站和靜態(tài)網(wǎng)站

1.3.3網(wǎng)站建設(shè)流程

1.4初學(xué)者常見問題

1.4.1XHTML語言的特點(diǎn)

1.4.2瀏覽器的作用

1.4.3靜態(tài)網(wǎng)頁和動(dòng)態(tài)網(wǎng)頁的區(qū)別

第2章網(wǎng)站制作基礎(chǔ)

2.1如何使用Dreamweaver建站

2.1.1定義站點(diǎn)

2.1.2制作靜態(tài)網(wǎng)頁

2.1.3制作動(dòng)態(tài)網(wǎng)頁

2.1.4瀏覽網(wǎng)頁

2.2策劃網(wǎng)站

2.2.1確定網(wǎng)站主題

2.2.2網(wǎng)站需求分析

2.2.3網(wǎng)站框架圖設(shè)計(jì)/交互設(shè)計(jì)

2.3視覺設(shè)計(jì)

2.4頁面開發(fā)

2.4.1如何切圖并保存切片

2.4.2CSS選擇器

2.4.3CSS盒模型

2.4.4CSS定位

2.4.5認(rèn)識(shí)div層

2.4.6div和span的區(qū)別

2.4.7網(wǎng)站文件規(guī)劃

2.4.8CSS樣式規(guī)劃

2.5頁面開發(fā)標(biāo)準(zhǔn)和規(guī)范

2.6綜合練習(xí)1—圖文排版效果

2.7綜合練習(xí)2—淘 寶導(dǎo)購(gòu)菜單

2.8初學(xué)者常見問題

2.8.1DIV CSS網(wǎng)站標(biāo)準(zhǔn)設(shè)計(jì)的優(yōu)勢(shì)

2.8.2如何考慮網(wǎng)站推廣問題

2.8.3什么是Web標(biāo)準(zhǔn)

2.8.4如何理解margin的加倍問題

2.8.5margin：0 auto表示什么含義

第3章左右兩欄固定寬度的布局

3.1頁面布局的分析

3.2頁面布局的實(shí)現(xiàn)

3.2.1兩欄浮動(dòng)

3.2.2兩欄絕對(duì)定位

3.2.3一欄浮動(dòng)，另一欄絕對(duì)定位

3.3網(wǎng)頁實(shí)例

3.3.1效果圖分析

3.3.2切圖

3.3.3繪制框架圖

3.3.4編寫XHTML代碼

3.3.5編寫CSS代碼

3.4小結(jié)

第4章左右兩欄寬度自適應(yīng)的布局

4.1頁面布局的分析

4.1.1示意圖

4.1.2布局分析

4.2頁面布局的實(shí)現(xiàn)

4.2.1兩欄浮動(dòng)

4.2.2兩欄絕對(duì)定位

4.2.3一欄浮動(dòng)，另一欄絕對(duì)定位

4.3網(wǎng)頁實(shí)例

4.3.1效果圖分析

4.3.2切圖

4.3.3繪制框架圖

4.3.4編寫XHTML代碼

4.3.5編寫CSS代碼

4.4小結(jié)

第5章一欄寬度固定，另一欄寬度自適應(yīng)的布局

5.1頁面布局的分析

5.1.1示意圖

5.1.2布局分析

5.2頁面布局的實(shí)現(xiàn)

5.2.1一欄浮動(dòng)，另一欄默認(rèn)文檔流并設(shè)置向左外邊距

5.2.2一欄絕對(duì)定位，另一欄默認(rèn)文檔流并設(shè)置向左外邊距

5.3網(wǎng)頁實(shí)例

5.3.1效果圖分析

5.3.2切圖

5.3.3繪制框架圖

5.3.4編寫XHTML代碼

5.3.5編寫CSS代碼

5.4小結(jié)

第6章三欄寬度固定的布局

6.1頁面布局的分析

6.1.1示意圖

6.1.2布局分析

6.2頁面布局的實(shí)現(xiàn)

6.2.1左中右三欄浮動(dòng)

6.2.2左中右三欄絕對(duì)定位

6.2.3左右兩欄浮動(dòng)，中間欄絕對(duì)定位

6.3網(wǎng)頁實(shí)例

6.3.1效果圖分析

6.3.2切圖

6.3.3繪制框架圖

6.3.4編寫XHTML代碼

6.3.5編寫CSS代碼

6.4小結(jié)

第7章左右兩欄寬度固定，中間欄寬度自適應(yīng)的布局

7.1頁面布局的分析

7.1.1示意圖

7.1.2布局分析

7.2頁面布局的實(shí)現(xiàn)

7.2.1左右兩欄浮動(dòng)，中間欄默認(rèn)文檔流并設(shè)置左右外邊距

7.2.2左右兩欄絕對(duì)定位，中間欄默認(rèn)文檔流并設(shè)置左右外邊距

7.3網(wǎng)頁實(shí)例

7.3.1效果圖分析

7.3.2切圖

7.3.3繪制框架圖

7.3.4編寫XHTML代碼

7.3.5編寫CSS代碼

7.4小結(jié)

第8章高度自適應(yīng)的布局

8.1頁面布局的分析

8.1.1示意圖

8.1.2布局分析

8.2頁面布局的實(shí)現(xiàn)

8.2.1正負(fù)內(nèi)外邊距

8.2.2為父容器添加背景圖

8.3網(wǎng)頁實(shí)例

8.3.1效果圖分析

8.3.2切圖

8.3.3繪制框架圖

8.3.4編寫XHTML代碼

8.3.5編寫CSS代碼

8.4小結(jié)

第9章項(xiàng)目1——論壇

9.1頁面效果圖分析

9.1.1頁面頭部和頁腳分析

9.1.2首頁主體內(nèi)容分析

9.1.3內(nèi)頁主體內(nèi)容分析

9.2布局規(guī)劃及切圖

9.2.1頁面布局規(guī)劃

9.2.2切割首頁及導(dǎo)出圖片

9.2.3切割內(nèi)頁及導(dǎo)出圖片

9.3 XHTML編寫

9.3.1搭建頁面XHTML框架

9.3.2編寫頁面頭部和頁腳的XHTML

9.3.3編寫頁面公共部分的XHTML

9.3.4編寫首頁主體內(nèi)容的XHTML

9.3.5編寫內(nèi)頁主體內(nèi)容的XHTML

9.3.6總覽首頁XHTML代碼

9.3.7總覽內(nèi)頁XHTML代碼

9.4CSS編寫

9.4.1頁面公共部分的CSS編寫

9.4.2頁面框架的CSS編寫

9.4.3頁面頭部和頁腳的CSS編寫

9.4.4首頁主體內(nèi)容的CSS編寫

9.4.5內(nèi)頁主體內(nèi)容的CSS編寫

9.4.6網(wǎng)站CSS代碼總覽

9.5制作中需要注意的問題

9.5.1網(wǎng)站文件規(guī)劃

9.5.2 CSS樣式規(guī)劃

第10章項(xiàng)目 2——電子政務(wù)網(wǎng)站 155^[3]

101頁面效果圖分析 155^[3]

1011頭部和頁腳分析 157^[3]

1012首頁主體內(nèi)容分析 158^[3]

1013內(nèi)頁主體內(nèi)容分析 159^[3]

102布局規(guī)劃及切圖 160^[3]

1021頁面布局規(guī)劃 160^[3]

1022切割首頁及導(dǎo)出圖片 160^[3]

1023切割內(nèi)頁及導(dǎo)出圖片 162^[3]

103 XHTML編寫 162^[3]

第11章項(xiàng)目3—電子商務(wù)網(wǎng)站

第12章項(xiàng)目4—新品展示網(wǎng)站

第13章網(wǎng)站的發(fā)布

附錄AHTML中支持的顏色名稱

附錄BCSS常用的屬性