巧学巧用Dreamweaver制作网页习题精解PDF电子书下载

第1章 基础知识 1

1.1 在网页中插入图片 1

掌握在网页制作过程中插入图片的方法 1

1.2 变换标题的格式 1

掌握更改文字属性的方法 3

1.3 文本的强制换行 3

文本中强制换行的方法 4

1.4 字体大小、颜色的设置 4

文本属性的应用 5

1.5 列表符号的应用 5

1.6 用CSS定义文字样式 6

列表符号的应用 6

掌握简单的定义和使用CSS样式的方法 7

1.7 图片与文字的对齐方式 7

掌握属性面板中的几种对齐方式 8

1.8 为图片添加链接 8

图片链接的设置方法 9

1.9 为文字添加链接 9

为文字添加链接 10

1.10 设置锚记链接 10

“插入→命名锚记”命令的应用 11

1.11 热区的设置 11

“矩形热点工具”和“多边形热点工具”的应用 12

1.12 插入水平线 12

1.13 交换图像（一） 13

水平线的插入方法 13

“交换图像”行为的应用 14

1.14 交换图像（二） 14

为按钮添加“交换图像”行为并设置相应的链接 15

1.15 设置邮件链接 15

为文字设置邮件链接 16

1.16 设置下载链接 16

给文字添加下载链接 17

第2章 网页布局 17

2.1 标准模式下使用表格设计版式 17

2.1.1 在页面中插入表格 17

标准模式下插入表格 17

2.1.2 自定义表格样式 17

在“属性”面板中更改表格边框的属性 18

2.1.4 双线表格的制作 18

“命令→格式化表格”命令的应用 18

2.1.3 隐藏表格边框 18

表格间距和边框颜色等参数的设置方法 19

2.1.5 单线表格的制作 19

单线表格制作方法 19

2.1.6 表格属性的综合应用 19

表格属性的综合应用 20

2.2 使用框架设计版式 20

2.2.1 “上方固定”模式的框架 20

2.2.4 厂字型框架布局设计（二） 21

“上方固定，左侧嵌套”模式框架的应用 21

2.2.3 厂字型框架布局设计（一） 21

“插入→HTML→框架→对齐上缘”命令的应用 21

创建一个“上方固定”模式的框架，并制作成页面 21

2.2.2 制作上中下结构的框架页面 21

“上方固定，左侧嵌套”模式框架的应用 22

2.2.5 上中下结构框架的布局 22

“对齐上缘”命令的应用 23

2.2.6 在框架页面中使用链接 23

使用框架在左侧列出导航链接 24

2.3 在布局视图模式下设计版式 24

2.3.1 国字型页面布局（一） 24

在布局模式下，使用“布局表格”和“绘制布局单元格” 25

2.3.2 国字型页面布局（二） 25

2.3.3 不规则布局 26

在布局模式下绘制表格样式 26

使用布局视图模式进行不规则页面的设计 27

2.3.4 左中右对称型布局 27

左中右结构页面的布局方法 28

2.3.5 最常见的左右布局 28

在布局模式下，构建最常见的左右布局网页 28

2.3.6 在网页中的色系搭配练习 28

相同结构的网页可以使用不同的色系 28

2.3.7 水平导航栏的网页布局 28

在布局模式下，使用“布局表格”绘制上下结构的表格样式 29

2.3.8 复杂结构的页面布局 29

3.1.1 暖色调网页布局练习 31

3.1 常用的网页布局 31

第3章 网页布局设计 31

绘制布局表格，以及页面颜色的搭配 31

在Photoshop中运用填充效果制作网页，在Dreamweaver中完成该网页 32

3.1.2 冷色调基本网页布局练习 32

在上面练习的基础上，制作冷色调网页 33

3.1.3 厂字型网页布局（一） 33

在Photoshop中设计厂字型网页布局 34

3.1.4 厂字型网页布局（二） 34

更充分地使用Photoshop的功能来加强网页的视觉效果 34

3.1.5 素材图片作背景的网页 34

3.1.7 三分栏布局 35

利用“填充”工具制作出网页布局 35

3.1.6 包围型网页布局 35

利用素材图片制作网页 35

制作基本的三分栏结构的网页 36

3.1.8 复杂的三分栏布局（一） 36

Photoshop中“图层样式”的应用 36

3.1.9 复杂的三分栏布局（二） 36

三分栏布局的变化 36

3.1.10 综合网页的布局 36

分栏布局的综合应用 37

3.2 不规则的页面布局 37

3.2.1 不规则布局（一） 37

Photoshop中“投影”和“填充”命令的结合应用 38

3.2.2 不规则布局（二） 38

Photoshop中“填充”的应用 39

3.2.4 不规则布局（四） 39

Photoshop的“斜面和浮雕”效果的应用 39

3.2.3 不规则布局（三） 39

“斜面和浮雕”效果的应用 40

3.2.5 不规则布局（五） 40

描边效果的应用 41

3.3 特殊页面布局 41

3.3.1 特殊页面（一） 41

Photoshop中“斜面和浮雕”效果的应用 42

3.3.2 特殊页面（二） 42

Photoshop中“斜面和浮雕”效果的应用 43

3.3.3 特殊页面（三） 43

特殊页面的布局方法 44

3.3.5 特殊页面（五） 44

Photoshop中“渐变叠加”和“光泽”效果的应用 44

3.3.4 特殊页面（四） 44

特殊页面的布局方法 45

第4章 制作网页中的按钮 45

4.1 在网页中插入Dreamweaver自带的Flash按钮 45

4.1.1 插入Flash按钮（一） 45

在页面中插入圆形Flash按钮 45

4.1.2 插入Flash按钮（二） 45

在页面中插入方形Flash按钮 45

4.1.3 插入Flash按钮（三） 45

Photoshop中“线性渐变”填充的应用 46

4.2.1 淡入淡出按钮 46

4.2.2 石质按钮 46

4.2 不同质感的按钮 46

在页面中插入异形的Flash按钮 46

“图层混合样式”中的“斜面和浮雕”效果的应用 47

4.2.3 软塑料按钮 47

“图层混合样式”的应用 47

4.2.4 渐变按钮 47

“渐变”和“描边”工具的结合使用 48

4.2.5 浮雕效果按钮 48

“渐变叠加”功能的使用 48

4.3 不同形状的按钮 48

4.3.1 书夹形状的按钮 48

4.3.4 螺母形按钮 49

Photoshop的填充功能的应用 49

4.3.3 荧光按钮 49

Photoshop填充的应用 49

4.3.2 砖形按钮 49

“渐变叠加”和“描边”的结合应用 49

“渐变叠加”和“内发光”效果的结合应用 50

4.3.5 水膜按钮 50

Photoshop中“描边”的应用 50

4.4 动态按钮 50

4.4.1 动态按钮（一） 50

Photoshop中的“色相／饱和度”工具的应用 51

4.4.2 动态按钮（二） 51

“渐变”和“描边”工具的结合应用 52

4.4.3 动态按钮（三） 52

“斜面和浮雕”效果的应用 52

4.4.4 动态按钮（四） 52

4.4.5 动态按钮（五） 53

“动感模糊”和“图案叠加”效果的结合应用 53

第5章 网页Banner的设计 55

5.1 纯文字的Banner设计 55

使用ImageReady制作动画GIF图片的方法 55

5.2 制作美食Banner（一） 55

“云彩”和“渐变叠加”效果的结合应用 55

使用ImageReady制作动画的方法，色彩的搭配 56

5.3 制作美食Banner（二） 56

ImageReady的应用 56

5.4 应用插画制作Banner 56

漫画效果的制作技巧 57

5.6 制作圣诞节Banner 57

5.5 漫画效果的Banner 57

在ImageReady中，把一幅插画制作成动画 57

节日Banner的制作方法 58

5.7 制作游戏Banner 58

在ImageReady中，多图层Banner的制作方法 58

5.8 制作公益广告Banner 58

在ImageReady中制作动画的方法 58

5.9 制作旅游广告Banner 58

ImageReady中动画的制作方法 59

5.10 制作卡通动画Banner 59

ImageReady中的动画制作技巧 61

第6章 网页导航栏的设计 61

6.1 最常见的左置导航栏 61

6.1.1 左置导航栏（一） 61

6.1.2 左置导航栏（二） 62

Photoshop中“斜面和浮雕”效果的应用 62

利用选区剪切制作导航栏 63

6.1.3 左置导航栏（三） 63

“图层混合样式”的应用 63

6.1.4 左置导航栏（四） 63

“斜面和浮雕”效果的使用 64

6.1.5 左置导航栏（五） 64

使用“斜面和浮雕”效果，制作书夹导航栏 65

6.1.6 左置导航栏（六） 65

“变形”命令的应用 66

6.2 置顶导航栏 66

6.2.1 置顶导航栏（一） 66

“斜面和浮雕”的应用 67

6.2.3 置顶导航栏（三） 67

6.2.2 置顶导航栏（二） 67

“斜面和浮雕”的应用 67

“投影”效果的应用 68

6.2.4 置顶导航栏（四） 68

矩形边框的制作方法 69

6.3 右置导航栏 69

6.3.1 右置导航栏（一） 69

滤镜中“扭曲”、“切变”工具的应用 70

6.3.2 右置导航栏（二） 70

“渐变”和“描边”工具的应用 71

6.3.3 右置导航栏（三） 71

“斜面和浮雕”效果的应用 71

6.3.4 右置导航栏（四） 71

6.3.5 右置导航栏（五） 72

“纹理化”效果的应用 72

“斜面和浮雕”和“投影”效果的结合应用 73

6.4 两级导航栏 73

6.4.1 两级导航栏（一） 73

“渐变”工具和“斜面和浮雕”效果的应用 74

6.4.2 两级导航栏（二） 74

“斜面和浮雕”和“投影”效果的结合应用 75

6.4.3 两级导航栏（三） 75

“斜面和浮雕”效果和“剪切”工具的应用 75

6.4.4 两级导航栏（四） 75

填充颜色应用 75

6.4.5 两级导航栏（五） 75

7.1 常用直角接角设计 77

7.1.1 应用纹理的设计方案 77

第7章 厂字型布局深入 77

“云彩”和“渐变叠加”效果的结合应用 77

“自定义图案”填充的应用 78

7.1.2 应用投影效果的设计方案 78

“图层混合样式”中“投影”和“描边”效果的应用 79

7.1.3 细线条与主体配合的设计方案 79

填充颜色应用 80

7.1.4 格子型的设计方案 80

选区剪切工具的使用 81

7.1.5 悬挂合页式的设计 81

“图层混合样式”中“斜面和浮雕”功能的应用 81

7.1.6 浮雕效果的设计方案 81

7.2.1 弧形接角 82

7.2 具有一些变化的厂字型布局网页 82

填充的应用 82

填充的应用 84

7.2.2 转角型接角 84

圆角矩形的应用 84

7.2.3 浮雕效果的接角 84

“投影”和“等高线”的结合应用 85

7.2.4 拱门形状接角 85

拱门形状的制作方法 85

7.2.5 曲线线条的应用 85

“斜面和浮雕”效果的应用 86

7.3 位图的处理与应用 86

7.3.1 用图片作接角（一） 86

7.3.2 用图片作接角（二） 87

“斜面和浮雕”效果的应用 87

填充效果的应用 88

7.3.3 用图片作接角（三） 88

“动感模糊”的应用 89

7.3.4 用图片作接角（四） 89

剪切效果的应用 90

7.3.5 用图片作接角（五） 90

“杂色”效果的应用 91

7.4 特殊衔接的接角处理 91

7.4.1 充分利用线条的设计方案 91

剪切效果应用 93

7.4.2 方格纹理的应用 93

7.4.4 悬浮接角 94

剪切和“投影”效果的结合应用 94

7.4.3 半圆接角 94

填充效果的应用 94

剪切效果的应用 95

第8章 网页图形元素的装饰设计 95

8.1 网站中的按钮装饰 95

8.1.1 单色的按钮装饰 95

填充的应用 96

8.1.2 描边按钮装饰 96

“描边”效果的制作 97

8.1.3 浮雕效果的按钮装饰 97

“斜面和浮雕”效果的应用 97

8.1.4 渐变装饰按钮 97

8.1.5 斜角按钮 98

渐变工具的使用 98

使用“钢笔”工具和“填充”的功能 99

8.1.6 图片装饰按钮 99

“图层混合样式”中“斜面和浮雕”效果的应用 100

8.1.7 凸起按钮装饰 100

“图层混合样式”中 “斜面和浮雕”的应用 100

8.2 导航条的装饰设计 100

8.2.1 光泽导航条 100

“填充图案”和“描边”的结合应用 101

8.2.2 石质效果的导航条 101

“图层混合样式”中的“斜面和浮雕”、“纹理化”的应用 102

8.2.3 路牌形状的导航条 102

8.2.5 不规则的导航条 103

“斜面和浮雕”效果的应用 103

“投影”和“等高线”的结合应用 103

8.2.4 木质的导航条 103

“椭圆选区”剪切的应用 104

8.2.6 渐变效果的导航条 104

渐变填充效果的应用 105

8.3 装饰性Banner 105

8.3.1 粗线条装饰Banner 105

填充效果的应用 106

8.3.2 素材叠加装饰Banner 106

“添加图层蒙板”的应用 107

8.3.3 渐变装饰效果 107

“剪切”和“图层混合”效果的应用 108

8.3.4 半透明方块装饰Banner 108

8.3.5 颜色递进效果的装饰 109

“杂色”效果的应用 109

填充效果的应用 110

8.4 综合装饰的效果 110

8.4.1 素材图片装饰（一） 110

“填充”和“斜面和浮雕”效果的应用 110

8.4.2 素材图片装饰（二） 110

“斜面和浮雕”效果的应用 111

8.4.3 线条的装饰效果 111

“渐变填充”效果的应用 111

8.4.4 颜色拼接装饰 111

“填充”和“斜面和浮雕”效果的应用 112

8.4.5 背景图片装饰Banner 112

9.1 便条纸效果 113

“斜面和浮雕”效果的应用 113

第9章 网站细节 113

“线性渐变”填充的应用 114

9.2 留言纸效果 114

利用图层叠加效果 115

9.3 便条留言板效果（一） 115

“图层混合模式”应用 115

9.4 便条留言板效果（二） 115

“图层混合样式”和“羽化”工具的结合使用 116

9.5 金属效果对话框（一） 116

使用了图层混合样式中的“渐变叠加”功能，制作金属效果 117

9.6 金属效果对话框（二） 117

9.7 留言板（一） 118

“渐变叠加”和“描边”的结合应用 118

“渐变”填充的应用 119

9.8 留言板（二） 119

“斜面和浮雕”的应用 119

9.9 投影效果 119

“描边”和“高斯模糊”的结合应用 120

9.10 描边效果 120

描边应用 121

第10章 综合练习 121

10.1 综合实例（一） 121

10.1.1 构图和切片 121

综合应用 122

10.1.2 制作按钮 122

10.1.3 制作链接页 123

在Photoshop中制作按钮 123

在Photoshop中制作链接页面 124

10.1.4 生成完整网站 124

在Dreamweaver中完成制作 125

10.2 综合实例（二） 125

10.2.1 主页的设计与切片 125

综合应用 127

10.2.2 制作首页 127

在Dreamweaver中制作首页 128

10.2.3 制作链接页 128

在Photoshop中制作链接页 129

10.2.4 生成完整网站 129

10.3 综合实例（三） 130

完成制作 130

综合应用 131

10.4 综合实例（四） 131

综合应用 135

第11章 使用行为制作网页的交互功能 135

11.1 交换图像 135

交换图像 135

11.2 弹出式对话框 135

设置弹出信息行为 136

11.3 弹出浏览器窗口 136

添加弹出浏览器行为 137

11.4 拼图效果 137

拖动层行为 138

11.5 控制网页Flash播放 138

11.7 改变属性 139

添加播放声音行为 139

插入媒体对象、表单按钮并给表单按钮添加行为 139

11.6 为文字添加背景音乐 139

改变属性行为 140

11.8 显示和隐藏层 140

“显示-隐藏层”命令的应用 141

11.9 显示和隐藏弹出式菜单 141

“显示弹出式菜单”行为 142

11.10 检查插件安装 142

检查插件行为 143

11.11 检查浏览器 143

检查浏览器 144

11.12 表单检查 144

导航栏图像行为 145

11.14 状态栏文本行为 145

11.13 导航栏图像行为 145

表单检查 145

状态栏文本行为 146

11.15 调用JavaScript 146

JavaScript的调用 147

11.16 跳转菜单和跳转菜单开始行为 147

跳转菜单和跳转菜单开始行为 148

11.17 自动链接新的站点 148

转动URL行为 151

第12章 模板与库 151

12.1 制作基于模板的实例 151

12.3 嵌套模板 152

套用模板实例 152

12.2 套用模板到页面 152

制作基于模板的实例 152

套用模板实例 153

12.4 在页面中添加和使用库项目 153

“库”的应用 154

12.5 修改库项目以更新整个站点 154

修改库项目更新站点 157

第13章 CSS应用 157

13.1 使用CSS定义文字的颜色和大小 157

创建CSS样式文件 158

13.3 附加外部CSS样式文件 158

13.2 创建CSS样式文件 158

CSS样式的创建 158

导入CSS样式 159

13.4 内置CSS样式效果 159

内置CSS样式效果的应用 159

13.5 用CSS定义背景色 159

使用CSS定义背景颜色 160

13.6 使用CSS定义对齐方式 160

对CSS样式中“方框→浮动”功能的应用 160

13.7 应用CSS定义表格边框 160

应用CSS定义表格边框 161

13.8 自定义项目符号的图像 161

应用CSS样式自定义项目符号的图像 162

13.9 特殊光标效果 162