第1篇 HTML篇

第1章 HTML与CSS网页设计概述

1.1 HTML的基本概念

1.1.1 什么是HTML

1.1.2 HTML的发展

1.1.3 HTML与XHTML

1.2 CSS的基本概念

1.2.1 什么是CSS

1.2.2 CSS在网页设计中的作用

1.3 网页与网站

1.3.1 网页与网站的关系

1.3.2 建立网站

1.3.3 URL

1.3.4 HTML与CSS的常用编辑工具

高手私房菜

技巧1：如何查看网页的HTML代码

技巧2：查看其他网站的CSS样式表文件

第2章 HTML文档的基本结构

2.1 基本的HTML文档

2.2 HTML文档的基本结构

2.2.1 文档类型的声明

2.2.2 ＜html＞标签对和属性

2.2.3 ＜head＞标签对和属性

2.2.4 ＜body＞标签对和属性

2.3 HTML标签、元素及属性

2.3.1 什么是标签

2.3.2 元素

2.3.3 属性的定义

2.3.4 属性值的定义

2.3.5 元素和属性的大小写规范

2.4 标准属性

2.5 HTML字符实体

2.6 为文档添加注释

2.7 空白和空白字符

2.7.1 断行符

2.7.2 空白字符

高手私房菜

技巧：属性值与引号的正确使用

第3章 辅助性元素

3.1 用＜title＞标签为文档添加标题

3.2 用＜base＞标签为文档设置基础URL

3.3 用＜link＞标签定义文档关系链接

3.3.1 定义关系链接地址

3.3.2 向前链接或者反转链接

3.3.3 链接到外部样式表

3.4 用＜style＞标签为文档创建内部样式表

3.4.1 定义样式类型

3.4.2 针对不同的媒体设备设置样式

3.5 用＜script＞标签添加脚本程序

3.5.1 设置脚本的类型

3.5.2 包含外部的脚本

3.6 用＜meta＞标签为文档定义元数据

3.6.1 定义元数据

3.6.2 定义元数据的各种情况

高手私房菜

技巧1：使用＜link＞标签定义浏览器标题栏小图标

技巧2：使用CSS hack技术使IE浏览器访问网页时应用特定的样式表文件

第4章 网页文本设计

4.1 文本的排版

4.1.1 标题＜h1＞、＜h2＞、＜h3＞、＜h4＞、＜h5＞和＜h6＞

4.1.2 字体标记

4.1.3 基本文字格式

4.1.4 特殊符号

4.2 段落的排版

4.2.1 段落标记及其对齐方式

4.2.2 换行＜br＞标记

4.2.3 居中标记

4.2.4 加入水平分割线

4.2.5 预编排标记

高手私房菜

技巧1：一级标题h1的使用

技巧2：在网页中插入版权符号？、注册商标符号？、未注册商品符号TM

技巧3：元素属性的默认值

第5章 网页列表设计

5.1 建立无序的列表

5.2 建立有序的列表

5.2.1 使用type属性定制有序列表项目符号

5.2.2 使用start属性定制有序列表中列表项的起始数

5.2.3 使用value属性定制有序列表中列表项序号的数值

5.3 建立定义列表

5.4 列表的嵌套

5.4.1 嵌套一层列表

5.4.2 嵌套多层列表

5.4.3 混合嵌套的列表

高手私房菜

技巧1：使用CSS样式表代替列表的type属性

技巧2：用ul列表模仿table表格

第6章 网页超链接设计

6.1 链接和路径

6.1.1 超链接的概念

6.1.2 链接路径URL

6.1.3 绝对URL和相对URL

6.2 使用a元素定义链接

6.2.1 设置链接的目标地址

6.2.2 设置链接的目标窗口

6.2.3 设置链接的提示信息

6.3 定义链接的不同情况

6.3.1 链接到同一个网站的另一个网页

6.3.2 使用锚链接到同一个网页的不同部分

6.3.3 使用锚链接到另一个网页的特定部分

6.3.4 链接到其他网站

6.3.5 设置链接发送E-mail

6.3.6 使用链接提供下载

高手私房菜

技巧1：锚点的定义

技巧2：区分URI、URL和URN

技巧3：禁用链接

第7章 网页色彩和图片设计

7.1 必备的图像基础知识

7.1.1 图像的分辨率

7.1.2 网页中的图片格式

7.1.3 创建图片

7.2 在网页中使用图像

7.2.1 在网页中插入图像标记

7.2.2 设置图像源文件

7.2.3 设置图像在网页中显示的宽度和高度

7.2.4 设置图像的替换文字

7.2.5 设置图像的提示文字

7.2.6 设置图像的边框

7.3 用图像代替文本作为超链接

7.4 图像映射

7.4.1 创建图像映射

7.4.2 利用Dreamweaver创建图像映射

高手私房菜

技巧1：浏览器的安全色

技巧2：图像映射

第8章 网页表格设计

8.1 表格的基本结构

8.2 控制表格的大小和边框的宽度

8.2.1 设置表格的宽度和高度

8.2.2 设置表格边框的宽度

8.3 设置表格及表格单元格的对齐方式

8.3.1 控制表格在网页中的对齐方式

8.3.2 控制表格单元格的水平对齐

8.3.3 控制表格单元格的上下对齐

8.4 合并单元格

8.4.1 用colspan属性左右合并单元格

8.4.2 用rowspan属性上下合并单元格

8.5 用cellpadding属性和cellspacing属性设定距离

8.6 为表格添加视觉效果

8.6.1 设置表格和单元格的背景颜色

8.6.2 设置表格和单元格的背景图像

8.7 表格的按行分组显示

高手私房菜

技巧1：禁止单元格内的文本自动换行

技巧2：colspan和rowspan属性的配合使用

第9章 网页表单设计

9.1 HTML表单

9.1.1 HTML表单的工作原理

9.1.2 创建表单

9.1.3 控件的概念

9.2 使用＜input＞标签创建表单控件

9.2.1 文本框和密码文本框

9.2.2 单选按钮

9.2.3 复选按钮

9.2.4 隐藏控件

9.2.5 文件选择框

9.2.6 重置按钮

9.2.7 提交按钮

9.2.8 图形提交按钮

9.3 使用＜textarea＞标签创建多行文本框

9.4 使用＜select＞和＜option＞标签创建选择列表

9.5 表单的提交方法

高手私房菜

技巧1：禁用表单控件

技巧2：设置表单控件为只读

第10章 网页框架设计

10.1 什么是框架

10.2 使用＜frameset＞和＜frame＞标签创建框架

10.2.1 框架的文档声明

10.2.2 用cols属性将窗口分为左、右两部分

10.2.3 用rows属性将窗口分为上、中、下三部分

10.2.4 框架的嵌套

10.2.5 不显示框架时

10.3 设置窗口框架的内容和外观

10.3.1 用src属性设置框架的初始内容

10.3.2 框架窗口边框的设置

10.3.3 控制框架的边距

10.3.4 框架的滚动条设置

10.3.5 改变框架窗口大小

10.4 设置框架之间的链接

10.4.1 用＜base＞标签设置链接默认目标

10.4.2 名称和框架标识

10.5 使用＜iframe＞＜／iframe＞标签对创建嵌入式框架

高手私房菜

技巧1：框架长度或者宽度的设置

技巧2：设置框架边框的注意事项

第11章 网页多媒体设计

11.1 在网页中加入视频

11.1.1 添加链接视频

11.1.2 使用Windows Media.Player嵌入视频

11.2 在网页中加入声音

11.2.1 添加背景声音

11.2.2 添加链接声音

11.2.3 使用RealPlayer嵌入声音

11.3 在网页中添加Flash动画

11.4 在网页中添加滚动文字

高手私房菜

技巧1：流式视频与音频

技巧2：选择合适的音频或者视频格式

第2篇 CSS篇

第12章 CSS 3样式基础

12.1 简单的CSS示例

12.2 CSS样式表的规则

12.3 使用CSS选择器

12.3.1 标签选择器

12.3.2 类选择器

12.3.3 id选择器

12.4 在HTML中调用CSS的方法

12.4.1 内联式CSS样式

12.4.2 内嵌式CSS样式

12.4.3 链接式CSS样式

12.4.4 导入外部CSS样式

12.4.5 CSS样式生效的优先级问题

高手私房菜

技巧：使用全局选择器

第13章 网页样式代码的生成方法

13.1 从零开始手工编写

13.1.1 编写标题样式代码

13.1.2 编写图片控制代码

13.1.3 设置网页正文

13.1.4 设置整体页面样式

13.1.5 定义段落样式

13.1.6 完整的代码

13.2 使用Dreamweaver辅助工具创建页面

13.3 在Dreamweaver中新建CSS样式

13.4 在Dreamweaver中编辑CSS样式

13.5 为图像创建CSS样式

高手私房菜

技巧1：在Dreamweaver中使用不同的复制和粘贴方式

技巧2：使用Dreamweaver生成CSS 3样式表并链接到当前文档

第14章 用CSS 3设置文本样式

14.1 样式的参数单位

14.1.1 长度单位

14.1.2 颜色单位

14.2 设置网页文本的基本样式

14.2.1 网页文本颜色的定义

14.2.2 设置具体文字的字体

14.2.3 设置文字的倾斜效果

14.2.4 设置文字的粗细效果

14.3 设置网页文本的行高与间距

14.3.1 设置网页文字间间距

14.3.2 设置网页文字行间高

14.3.3 设置网页文字段落间距

14.4 设置网页文本的对齐方式

14.4.1 控制文本的水平对齐方式

14.4.2 设置文本的垂直对齐方式

14.5 设置文字与背景的颜色

14.6 其他网页文本样式设置

14.6.1 英文字母大小写自动转换的实现

14.6.2 控制文字的大小

14.6.3 网页文字的装饰效果

14.6.4 设置段落首行缩进效果

高手私房菜

技巧1：通过滤镜属性设置文字效果

技巧2：为网页中字体大小设置合适的样式

第15章 用CSS 3设置网页图像特效

15.1 设置图片边框

15.1.1 图像边框基本属性

15.1.2 为不同的边框分别设置样式

15.2 图片缩放功能的实现

15.3 设置图片与文字的对齐方式

15.3.1 横向对齐方式

15.3.2 纵向对齐方式

15.4 图文混排

15.4.1 文字环绕

15.4.2 设置图片与文字的间距

15.5 CSS 3中边框的新增属性

15.5.1 border-image

15.5.2 border-radius

15.5.3 border-color

15.5.4 box-shadow

高手私房菜

技巧：图片超出撑破DIV

第16章 用CSS 3设置网页背景颜色与背景图像

16.1 设置背景颜色

16.2 设置背景图像

16.3 设置背景图像平铺

16.4 设置背景图像的位置

16.5 设置背景图片位置固定

16.6 设置标题的图像替换

16.7 使用滑动门技术的标题

高手私房菜

技巧1：为网页内容添加水印

技巧2：使用background-position属性设置背景图片居中显示

第17章 CSS 3的高级特性

17.1 复合选择器

17.1.1 交集选择器

17.1.2 并集选择器

17.1.3 后代选择器

17.2 CSS的继承特性

17.2.1 继承关系

17.2.2 CSS继承的运用

17.3 CSS的层叠特性

高手私房菜

技巧：CSS选择器的特殊性

第18章 DIV+CSS 3网页标准化布局

18.1 定义DIV

18.1.1 什么是DIV

18.1.2 在HTML文档中应用DIV

18.1.3 DIV的嵌套和固定格式

18.2 CSS布局定位

18.2.1 浮动定位

18.2.2 position定位

18.3 可视化模型

18.3.1 盒模型

18.3.2 视觉可视化模型

18.3.3 空白边叠加

18.4 CSS布局方式

18.4.1 居中的布局设计

18.4.2 浮动的布局设计

18.4.3 高度自适应设计

18.5 CSS 3中盒模型的新增属性

18.5.1 overflow

18.5.2 overflow-x

18.5.3 overflow-y

高手私房菜

技巧：将多个DIV紧靠页面的左侧或者右侧

第3篇 综合应用篇

第19章 用HTML+CSS 3设计制作企业网站页面

19.1 设计分析

19.2 布局分析

19.3 制作步骤

19.4 实例总结

第20章 用HTML+CSS 3设计制作休闲游戏网站页面

20.1 设计分析

20.2 布局分析

20.3 制作步骤

20.4 实例总结

第21章 用HTML+CSS 3设计制作电子商务网站页面

21.1 设计分析

21.2 布局分析

21.3 制作步骤

21.4 实例总结

第4篇 实战篇

第22章 企业门户类网站布局分析

22.1 中粮网整体布局分析

22.1.1 整体设计分析

22.1.2 版面架构分析

22.1.3 网站模块组成

22.2 制作自己的企业网站——龙马蜂业产品网

22.2.1 整体分析

22.2.2 结构与布局

22.2.3 网站制作步骤

22.2.4 实例总结

第23章 休闲旅游类网站布局分析

23.1 去哪儿网整体布局分析

23.1.1 整体设计分析

23.1.2 版面架构分析

23.1.3 网站模块组成

23.2 制作自己的休闲旅游网站——龙马休闲旅游网

23.2.1 整体分析

23.2.2 结构与布局

23.2.3 网站制作步骤

23.2.4 实例总结