HTML+CSS網頁設計教程

內容簡介

本書編者根據多年的教學經驗，理論與實際相結合系統地講述了如何利用HTML+CSS技術控制文字、圖片、表格、背景及導航選單等網頁元素的方法。通過大量肯煉去實例對CSS進行深入淺出的分析，著重講解如何用HTML+CSS進行網頁布局，實例的可操作性極強，難度適中，使讀者在學習CSS套用技術的同時，掌握HTML+CSS的精髓。本書的定騙最後給出了常見商業類型完整網頁的綜合實例，讓讀者進凶巴兆抹一步鞏固所學到的知識，提高綜合套用的能力只禁牛。

第1章 HTML入門

1.1 HTML簡介

1.1.1 用HTML建探愉燥兵立第一個網頁

1.1.2 HTML檔案結構

1.1.3 HTML與XHTML

1.2 HTML的簡單套用

習題

第2章利用HTML製作網頁

2.1 用HTML設定文本和圖像

2.1.1 文本排版

2.1.2 設定文字列表

2.1.3 HTML標記及屬性

2.1.4 在網頁中使用圖像

2.2 用HTML建立超連結

2.3 用HTML創建表格

2.3.1 表格的基本結構

2.3.2 合併單元格

2.3.3 設定對齊方式

2.3.4 設定表格背景和框線顏色

2.3.5 表格單元格邊線間的距離

2.3.6 設定表格標題

2.3.7 完整的表格標記

2.4 套用實例

2.4.1 設計分析

2.4.2 製作步驟

習題

第3章 CSS基礎

3.1 CSS概述

3.1.1 CSS的定義

3.1.2 CSS的基本語法

3.2 基本CSS選擇器

3.2.1 標記選擇器

3.2.2 類別選擇器

3.2.3 ID選擇器

3.3 選擇器的聲明

3.3.1 分組

3.3.2 嵌套

3.4 CSS調用

3.4.1 行內樣式表

3.4.2 內舟妹鑽嵌式樣式表

3.4.3 連結式樣式表

3.4.4 導入樣式表

3.5 套用實例—為頁面添加CSS樣式

3.5.1 設計分析

3.5.2 製作步驟

習題

第4章文字效果

4.1 文字的基本樣式

4.1.1 字型樣式

4.1.2 字型顏色

4.1.3 字型大小

4.1.4 字型加粗

4.1.5 字型傾斜

4.1.6 字型下劃線、頂劃線、刪除線

4.1.7 英文字母大小寫轉換

4.2 文本效果

4.2.1 行距

4.2.2 文字與單詞間距

4.2.3 首行縮進

4.2.4 水平對齊方式

4.2.5 垂直對齊方式

4.2.6 首字下沉

4.3 套用實例

4.3.1 設計分析

4.3.2 製作步驟

習題

第5章圖片效果

5.1 圖片樣式

5.1.1 圖片框線設定

5.1.2 圖片縮放設定

5.2 圖片對齊

5.2.1 水平對齊設定

5.2.2 垂直對齊設定

5.3 圖文混排

5.3.1 文本混排

5.3.2 設定混排間距

5.4 套用實例

5.4.1 設計分析

5.4.2 製作步驟

習題

第6章背景效果

6.1 背景顏色

6.1.1 設定頁面背景顏色

6.1.2 頁面分塊設定背景色

6.2 背景圖片

6.2.1 為頁面設定背景圖片

6.2.2 背景圖片的重複

6.2.3 設定背景圖片的位置

6.2.4 設定背景關聯

6.3 套用實例

6.3.1 設計分析

6.3.2 製作步驟

習題

第7章框線設計

7.1 框線的定義

7.1.1 框線樣式

7.1.2 框線的顏色

7.1.3 框線寬度

7.1.4 框線綜合屬性

7.2 表格框線

7.3 套用實例

7.3.1 設計分析

7.3.2 制微廈說作步驟

習題

第8章表單的套用

8.1 表單概述

8.2 創建表單

8.3 input控制項

8.3.1 input控制項的type屬性

8.3.2 input控制項的其他屬性

8.4 其他表單控制項

8.4.1 textarea控制項

8.4.2 select控制項

8.4.3 datalist控制項

8.5 CSS控制表單樣式

8.6 套用實例

8.6.1 設計分析

8.6.2 製作步驟

習題

第9章製作實用的選單

9.1 關於ul 和li 的樣式詳解

9.1.1 使用list-style-type 屬性

9.1.2 使用list-style-position 屬性

9.1.3 使用list-style-image 屬性

9.1.4 list-style 屬性

9.2 縱嚮導航選單的製作

9.2.1 選單製作步驟

9.2.2 製作選單內容和結構部分

9.2.3 CSS 代碼編寫

9.3 套用實例

9.3.1 設計分析

9.3.2 製作步驟

習題

第10章使用CSS美化瀏覽器效果

10.1 使用CSS控制超連結

10.2 按鈕式超連結

10.3 浮雕式超連結

10.4 滑鼠特效

10.5 套用實例

10.5.1 設計分析

10.5.2 製作步驟

習題

第11章 DIV+CSS布局

11.1 初識DIV+CSS布局的流程

11.2 了解盒模型

11.3 頁面元素的定位

11.3.1 CSS布局方式—浮動

11.3.2 CSS布局方式—絕對定位

11.3.3 CSS布局方式—相對定位

11.4 套用實例—使用DIV+CSS布局頁面

11.4.1 設計分析

11.4.2 製作步驟

習題

第12章旅遊景區網站

12.1 案例效果圖分析

12.2 原型設計

12.3 製作頁面頭部

12.3.1 頭部的分析

12.3.2 頭部HTML編碼

12.3.3 CSS代碼的編寫

12.4 製作頁面內容部分

12.4.1 內容部分的分析

12.4.2 HTML編碼

12.4.3 CSS代碼的編寫

12.5 製作頁面底部

12.5.1 底部的分析

12.5.2 底部HTML編碼

12.5.3 CSS代碼的編寫

習題

第13章兒童用品網上商店

13.1 案例效果圖分析

13.2 原型設計與布局規劃

13.3 製作頁面頭部

13.3.1 頭部的分析

13.3.2 頭部HTML編碼

13.3.3 CSS代碼的編寫

13.4 製作頁面內容層的圖片部分

13.4.1 圖片部分的分析

13.4.2 HTML編碼

13.4.3 CSS代碼的編寫

13.5 製作頁面內容層的列表部分

13.5.1 列表部分的分析

13.5.2 HTML編碼

13.5.3 CSS代碼的編寫

13.6 製作sidebar部分

13.6.1 sidebar部分的分析

13.6.2 HTML編碼

13.6.3 CSS代碼的編寫

13.7 製作footer部分

13.7.1 底部footer的分析

13.7.2 底部HTML編碼

13.7.3 CSS代碼的編寫

習題

第14章我的部落格

14.1 案例效果圖分析

14.2 製作頁面頭部

14.2.1 頭部的分析

14.2.2 頭部#header的HTML編碼

14.2.3 #header的CSS代碼

14.2.4 頭部#banner的HTML編碼

14.2.5 #banner的CSS代碼

14.3 製作頁面中間部分

14.3.1 左部#main部分的分析

14.3.2 HTML編碼

14.3.3 #main的CSS代碼的編寫

14.3.4 右側#sidebar部分的分析

14.3.5 HTML編碼

14.3.6 #sidebar的CSS代碼的編寫

14.4 製作footer部分

14.4.1 底部footer的分析

14.4.2 底部HTML編碼

14.4.3 CSS代碼的編寫

習題

參考文獻

HTML+CSS網頁設計教程

基本介紹

相關詞條

熱門詞條