描述
开 本: 16开纸 张: 胶版纸包 装: 平装是否套装: 否国际标准书号ISBN: 9787302443292丛书名: 新起点电脑教程
本书共14章，主要内容包括网页设计与制作基础、创建与管理站点、在网页中编排文本和多媒体对象、设计网页超级链接、使用表格和CSS布局页面、使用模板和库创建网页、在网页中应用表单和行为、制作jQuery Mobile页面以及站点的发布与推广等方面的知识。
本书配套一张多媒体全景教学光盘，收录了本书全部知识点的视频教学课程，同时还赠送了4套相关视频教学课程。超低的学习门槛和超大光盘内容含量，可以帮助读者循序渐进的学习、掌握和提高。
本书面向学习该软件的初中级用户，适合无基础知识又想快速掌握Dreamweaver CC入门操作经验的读者，同时对有经验的Dreamweaver CC使用者也有很高的参考价值，还可以作为高等院校专业课教材和社会培训机构平面设计培训教材。
目 录
第1章 网页设计与制作基础 1
1.1 网页概述 2
1.1.1 网页基本要素 2
1.1.2 网页基本术语 4
1.1.3 静态网页和动态网页 6
1.2 网页编辑器和屏幕分辨率 7
1.2.1 网页编辑器 7
1.2.2 屏幕分辨率 7
1.3 网站制作的基本流程 8
1.3.1 前期策划 8
1.3.2 收集素材 8
1.3.3 规划网站 8
1.3.4 制作HTML页面 9
1.3.5 测试并上传网站 9
1.3.6 网站的更新与维护 9
1.4 网页设计中的色彩应用 9
1.4.1 网页色彩的特性 9
1.4.2 网页安全色 10
1.4.3 色彩模式 11
1.4.4 网页配色的基本原则 12
1.4.5 网页配色中的文本颜色 14
1.5 网页制作常用软件 16
1.5.1 网页编辑排版软件
Dreamweaver CC 16
1.5.2 图像制作软件Photoshop CC
和Fireworks CC 16
1.5.3 网页动画制作软件Flash CC 16
1.5.4 网页标记语言HTML 17
1.5.5 网页脚本语言JavaScript 17
1.5.6 动态网页编程语言ASP 17
1.6 思考与练习 17
第2章 Dreamweaver CC轻松入门 19
2.1 Dreamweaver CC工作界面 20
2.1.1 界面布局 20
2.1.2 工具栏、窗口和面板 20
2.1.3 【插入】面板 22
2.1.4 属性检查器 23
2.1.5 管理面板和面板组 24
2.2 Dreamweaver 工作流程 24
2.3 使用可视化助理布局 24
2.3.1 使用标尺 25
2.3.2 设置网格 26
2.4 实践案例与上机指导 28
2.4.1 使用辅助线 28
2.4.2 使用跟踪图像功能 30
2.4.3 设置缩放比率 30
2.4.4 设置窗口大小 31
2.5 思考与练习 32
第3章 创建与管理站点 33
3.1 站点及站点结构 34
3.1.1 站点 34
3.1.2 站点结构 35
3.2 创建本地站点 35
3.2.1 使用向导搭建站点 35
3.2.2 使用【高级设置】选项
面板创建站点 37
3.3 管理站点 40
3.3.1 打开站点 40
3.3.2 切换站点 41
3.3.3 【管理站点】对话框 41
3.4 管理站点中的文件 42
3.4.1 在站点中新建文件夹 42
3.4.2 在站点中新建页面 43
3.4.3 移动和复制文件或文件夹 43
3.4.4 删除文件或文件夹 44
3.5 实践案例与上机指导 44
3.5.1 使用【新建文档】对话框
创建新文件 45
3.5.2 Business Catalyst站点 46
3.5.3 Edge Animate资源 47
3.6 思考与练习 47
第4章 在网页中编排文本 49
4.1 文本的基本操作 50
4.1.1 输入文本 50
4.1.2 设置字体 51
4.1.3 设置字号 52
4.1.4 设置字体颜色 52
4.1.5 设置字体样式 53
4.1.6 设置段落对齐方式 53
4.1.7 设置是否显示不可见元素 54
4.2 插入特殊文本对象 55
4.2.1 插入特殊字符 55
4.2.2 插入水平线 56
4.2.3 插入日期 57
4.3 设置项目列表 57
4.3.1 创建项目列表与编号列表 58
4.3.2 设置列表属性 59
4.4 设置页面的头信息 59
4.4.1 设置网页标题 60
4.4.2 添加关键字 60
4.4.3 添加说明 61
4.4.4 插入视口 61
4.4.5 设置链接 62
4.4.6 设置页面的Meta信息 63
4.5 实践案例与上机指导 63
4.5.1 查找与替换功能 63
4.5.2 设置页边距 64
4.5.3 设置网页的默认格式 64
4.5.4 设置文本缩进格式 65
4.6 思考与练习 65
第5章 使用图像与多媒体丰富
网页内容 67
5.1 网页中的常用图像格式 68
5.1.1 JPEG格式图像 68
5.1.2 GIF格式图像 68
5.1.3 PNG格式图像 68
5.2 插入与设置图像 69
5.2.1 在网页中插入图像文件 69
5.2.2 设置网页背景图 70
5.2.3 设置图像对齐方式 71
5.2.4 更改图像基本属性 72
5.2.5 使用图像编辑器 72
5.3 插入其他图像元素 74
5.3.1 插入鼠标经过图像 74
5.3.2 插入Fireworks HTML 75
5.4 多媒体在网页中的应用 75
5.4.1 插入并设置Flash动画 76
5.4.2 插入FLV视频 77
5.4.3 插入音乐 79
5.5 实践案例与上机指导 80
5.5.1 插入HTML5 Video 80
5.5.2 插入HTML5 Audio 82
5.6 思考与练习 83
第6章 网页超级链接 85
6.1 超级链接 86
6.1.1 超链接的定义 86
6.1.2 内部、外部与脚本链接 86
6.2 链接路径 87
6.2.1 路径 87
6.2.2 相对路径 88
6.2.3 站点根目录相对路径 88
6.3 创建超级链接 88
6.3.1 使用【指向文件】按钮
创建链接 89
6.3.2 使用【属性】面板创建
链接 89
6.4 创建不同种类的超链接 89
6.4.1 文本超链接 90
6.4.2 图像热点链接 90
6.4.3 空链接 91
6.4.4 电子邮件链接 92
6.4.5 脚本链接 93
6.5 管理与设置超级链接 93
6.5.1 自动更新链接 93
6.5.2 在站点范围内更改链接 94
6.5.3 检查站点中的链接错误 95
6.6 实践案例与上机指导 96
6.6.1 创建锚记链接 96
6.6.2 制作文件下载链接 98
6.7 思考与练习 99
第7章 使用表格布局页面 101
7.1 表格的创建与应用 102
7.1.1 表格的定义与用途 102
7.1.2 创建基本表格 103
7.1.3 向表格中输入文本 104
7.1.4 在单元格中插入图像 104
7.2 设置表格和单元格属性 105
7.2.1 设置表格属性 105
7.2.2 设置单元格属性 106
7.3 调整表格结构 107
7.3.1 选择表格和单元格 107
7.3.2 调整单元格和表格的大小 109
7.3.3 插入与删除表格的行和列 110
7.3.4 拆分单元格 112
7.3.5 合并单元格 113
7.3.6 复制、剪切和粘贴表格 114
7.4 处理表格数据 116
7.4.1 导入Excel表格数据 116
7.4.2 排序表格 117
7.5 应用数据表格样式控制 118
7.5.1 表格模型 118
7.5.2 表格标题 119
7.5.3 表格样式控制 120
7.6 实践案例与上机指导 121
7.6.1 在表格中插入图像 121
7.6.2 在表格中插入表格 122
7.6.3 制作网页细线表格 122
7.7 思考与练习 123
第8章 应用CSS样式美化网页 125
8.1 什么是CSS样式表 126
8.1.1 认识CSS 126
8.1.2 CSS样式的类型 126
8.1.3 CSS基本语法 127
8.2 创建CSS样式 128
8.2.1 建立标签样式 128
8.2.2 建立类样式 129
8.2.3 建立复合内容样式 131
8.2.4 链接外部样式表 132
8.2.5 建立ID样式 133
8.3 将CSS应用到网页 135
8.3.1 内联样式表 135
8.3.2 数据透视表的排序 135
8.3.3 外部样式表 136
8.4 设置CSS样式 136
8.4.1 设置背景类型 136
8.4.2 设置方框样式 137
8.4.3 设置区块样式 138
8.4.4 设置边框样式 139
8.4.5 设置定位样式 140
8.4.6 设置扩展样式 140
8.4.7 设置过渡样式 141
8.5 实践案例与上机指导 142
8.5.1 CSS静态过滤器 142
8.5.2 样式冲突 143
8.5.3 CSS动态过滤器 143
8.6 思考与练习 143
第9章 应用Div CSS灵活布局
网页 145
9.1 Div概述 146
9.1.1 初识Div 146
9.1.2 Div CSS布局的优势 146
9.1.3 盒模型 146
9.2 常见的布局方式 148
9.2.1 居中版式布局 148
9.2.2 浮动版式布局 149
9.2.3 高度自适应布局 151
9.3 应用Div布局网页 152
9.3.1 页面布局分析 152
9.3.2 插入和编辑Div标签 153
9.3.3 使用CSS定位 155
9.4 实践案例与上机指导 155
9.4.1 一列自适应宽度 156
9.4.2 两列自适应宽度 156
9.4.3 两列右列宽度自适应 157
9.4.4 三列浮动中间宽度自适应 157
9.5 思考与练习 158
第10章 使用模板和库创建网页 159
10.1 使用模板 160
10.1.1 模板的特点 160
10.1.2 创建模板 160
10.1.3 嵌套模板 161
10.2 设置模板 162
10.2.1 定义可编辑区域 162
10.2.2 定义可选区域 163
10.2.3 定义重复区域 163
10.2.4 设置可编辑标签属性 164
10.3 管理模板 165
10.3.1 创建基于模板的网页 165
10.3.2 更新模板和基于模板的
网页 166
10.3.3 删除页面中使用的模板 167
10.4 创建与应用库项目 168
10.4.1 认识库项目 168
10.4.2 创建库项目 169
10.4.3 插入库项目 170
10.4.4 修改库项目 171
10.4.5 更新库项目 171
10.5 实践案例与上机指导 172
10.5.1 重命名库项目 172
10.5.2 删除库项目 173
10.5.3 恢复删除的库项目 173
10.6 思考与练习 174
第11章 在网页中插入表单 177
11.1 表单概述 178
11.1.1 关于表单 178
11.1.2 常用表单元素 178
11.1.3 HTML5表单元素 180
11.2 添加表单 181
11.2.1 插入表单域 182
11.2.2 插入文本域 183
11.3 网页元素 185
11.3.1 表单密码 185
11.3.2 Url对象 186
11.3.3 Tel对象 186
11.3.4 搜索对象 187
11.3.5 数字对象 187
11.3.6 范围对象 188
11.3.7 颜色对象 189
11.3.8 电子邮件对象 189
11.4 日期与时间元素 190
11.4.1 月对象 190
11.4.2 周对象 191
11.4.3 日期对象 192
11.4.4 时间对象 192
11.4.5 日期时间对象 193
11.4.6 本地日期时间对象 194
11.5 选择元素 195
11.5.1 选择对象 195
11.5.2 单选按钮对象 196
11.5.3 单选按钮组对象 196
11.5.4 复选框对象 197
11.5.5 复选框组对象 198
11.6 按钮元素 199
11.6.1 普通按钮 199
11.6.2 “提交”按钮对象 200
11.6.3 “重置”按钮对象 201
11.6.4 图像按钮对象 201
11.7 实践案例与上机指导 202
11.7.1 文件对象 202
11.7.2 隐藏对象 203
11.7.3 文本区域对象 204
11.8 思考与练习 205
第12章 使用行为创建动态效果 207
12.1 认识网页行为 208
12.1.1 事件与动作 208
12.1.2 使用【行为】面板 208
12.1.3 常见动作类型 209
12.1.4 编辑网页行为 210
12.2 使用行为调节浏览器 210
12.2.1 打开浏览器窗口 210
12.2.2 调用JavaScript 212
12.2.3 转到URL 212
12.3 使用行为控制图像 213
12.3.1 交换图像 213
12.3.2 预先载入图像 214
12.4 使用行为显示文本 215
12.4.1 设置弹出信息 215
12.4.2 设置状态栏文本 216
12.4.3 设置容器的文本 217
12.4.4 设置文本域文字 218
12.5 使用行为加载多媒体 219
12.5.1 检查插件 219
12.5.2 改变属性 220
12.5.3 显示和隐藏元素 221
12.6 使用行为控制表单 222
12.6.1 跳转菜单 222
12.6.2 跳转菜单开始 223
12.6.3 检查表单 224
12.7 实践案例与上机指导 226
12.7.1 拖动AP元素行为 226
12.7.2 恢复交换图像 227
12.7.3 设置框架文本 227
12.8 思考与练习 228
第13章 制作jQuery Mobile页面 231
13.1 jQuery与jQuery Mobile概述 232
13.1.1 jQuery 232
13.1.2 jQuery Mobile 232
13.2 创建jQuery Mobile页面 233
13.2.1 使用jQuery Mobile起始页 233
13.2.2 使用HTML5页 234
13.2.3 jQuery Mobile页面结构 235
13.3 使用jQuery Mobile组件 236
13.3.1 使用列表视图 236
13.3.2 使用布局网格 237
13.3.3 使用可折叠区块 237
13.3.4 使用文本输入框 238
13.3.5 使用密码输入框 239
13.3.6 使用文本区域 239
13.3.7 使用选择菜单 240
13.3.8 使用复选框 240
13.3.9 使用单选按钮 241
13.3.10 使用按钮 242
13.3.11 使用滑块 243
13.3.12 设置翻转切换开关 243
13.4 实践案例与上机指导 244
13.4.1 jQuery Mobile主题 244
13.4.2 创建有序列表 245
13.4.3 创建内嵌列表 246
13.5 思考与练习 247
第14章 站点的发布与推广 249
14.1 测试站点 250
14.1.1 创建站点报告 250
14.1.2 使用链接检查器 251
14.1.3 W3C验证 251
14.2 上传发布网站 252
14.2.1 连接到远程服务器 252
14.2.2 文件上传 254
14.2.3 文件下载 255
14.3 网站运营与维护 255
14.3.1 网站的运营 256
14.3.2 网站的更新维护 257
14.3.3 优化网站SEO 257
14.4 常见的网站推广方式 258
14.4.1 注册搜索引擎 258
14.4.2 资源合作推广方法 259
14.4.3 电子邮件推广 260
14.4.4 导航网站登录 261
14.4.5 软文推广 261
14.4.6 BBS论坛网站推广 261
14.4.7 博客推广 262
14.4.8 微博推广 262
14.4.9 病毒性营销 263
14.4.10 口碑营销 264
14.4.11 微信营销 264
14.5 思考与练习 265
附录 思考与练习答案 267
第2章 Dreamweaver CC轻松入门
* Dreamweaver CC工作界面
* Dreamweaver CC工作流程
* 使用可视化助理布局
本章主要介绍Dreamweaver CC工作界面、Dreamweaver CC工作流程、使用可视化助理布局方面的知识与技巧，在本章的后还针对实际工作需求，讲解了使用辅助线、使用跟踪图像功能、设置缩放比率、设置窗口大小的方法。通过本章的学习，读者可以掌握Dreamweaver CC入门方面的知识，为深入学习Dreamweaver CC奠定基础。
2.1
Dreamweaver CC工作界面
Dreamweaver CC包含了一个崭新、高效的页面，性能也得到了改进。此外，还包含了众多新增功能，改善了软件的操作性，用户无论使用【设计】视图还是【代码】视图，都可以方便地创建网页。本节主要讲述Dreamweaver CC的工作环境。
2.1.1
界面布局
启动Dreamweaver CC，进入Dreamweaver CC工作界面，其中包括菜单栏、工具栏、【插入】面板、编辑窗口、【属性】面板和浮动面板组6个部分，如图2-1所示。
图2-1
2.1.2
工具栏、窗口和面板
Dreamweaver CC工作界面中的工具栏、窗口和面板分别有着各自的功能和作用，本节将详细介绍。
1. 工具栏
工具栏中包含了各种工具按钮，单击工作界面左侧的【代码】、【拆分】、【设计】按钮，可以在文档的不同视图间快速切换，包括【代码】视图、【设计】视图，以及同时显示【代码】视图和【设计】视图的【拆分】视图。工具栏还包含一些与查看文档、在本地和远程站点间传输文档有关的常用命令和选项，如图2-2所示。
图2-2
> 【代码】按钮：单击此按钮，可以在窗口中显示【代码】视图。
> 【拆分】按钮：在窗口的一部分显示【代码】视图，而在另一部分显示【设计】视图。
> 【设计】按钮：单击此按钮，可以在窗口中显示【设计】视图。
> 【实时视图】按钮：显示不可编辑的、交互式的、基于浏览器的文档视图。
> 【在浏览器中预览/调试】按钮：单击此按钮，可以在浏览器中预览或调试文档。从下拉菜单中可以选择一个浏览器。
> 【标题】文本框：可以为文档输入一个标题，将显示在浏览器的标题栏中。如果文档已经有了一个标题，则该标题将显示在该文本框中。
> 【文件管理】按钮：当有多人对一个页面进行操作时，可以分别进行获取、取出、打开文件、导出和设计附注等操作。
2. 窗口
在编辑窗口中，网页制作者可以实时查看网页制作的效果，从而进一步地完善修改工作，如图2-3所示。
图2-3
3. 面板
Dreamweaver CC有很多面板，选择【窗口】菜单，在弹出的子菜单中可以根据需要将各个面板调出，如图2-4所示。
图2-4
Dreamweaver CC界面默认打开的面板有【插入】面板、【文件】面板以及【属性】面板(也称属性检查器)。
2.1.3
【插入】面板
在【插入】面板中包括【常用】、【结构】、【媒体】、【表单】、jQuery Mobile、jQuery UI、【模板】、【收藏夹】8个选项，每个选项又包含多个子选项，用户可以根据需要在网页中插入适合网页的内容，如图2-5所示。
图2-5
下面以【常用】选项为例，介绍如何创建和插入常用的对象，如图2-6和图2-7所示。
> Div：单击该按钮，可以使用Div标签创建CSS布局块，并进行相应的定位。
> 【图像】：单击该按钮，可以在文档中插入图像。
> 【表格】：单击该按钮，可以在网页中插入表格。
> 【脚本】：包含几个与脚本有关联的按钮。
> 【电子邮件链接】：在【文本】文本框中输入E-mail地址或其他文字信息，然后在E-mail文本框中输入准确的邮件地址，就可以自动插入邮件地址发送链接。
> 【水平线】：单击该按钮，可以在网页中插入水平线。
> 【日期】：单击该按钮，可以插入当前的时间和日期。
图2-6
图2-7
2.1.4 属性检查器
Dreamweaver CC的属性检查器，主要用于查看和更改所选择对象的各种属性。其中包含两个选项，即HTML选项和CSS选项，HTML选项为默认格式；单击不同的选项可以设置不同的属性，如图2-8所示。
图2-8
使用属性检查器，可以检查和编辑当前页面选定元素的常用属性，如文本和插入的对象。属性检查器的内容根据选定元素的不同会有所不同。例如，如果选择了页面上的图像，则属性检查器就会显示该图像的属性，如图像的文件路径、图像的宽度和高度、图像周围的边框等。
默认情况下，属性检查器位于工作区的底部边缘，但是可以将其取消停靠并使其成为工作区中的浮动面板。单击属性检查器右上角的下拉按钮，在弹出的下拉菜单中选择【关闭】菜单项，即可关闭属性检查器，如图2-9所示。
图2-9
2.1.5
管理面板和面板组
如果在Dreamweaver CC工作界面中打开太多面板，会使工作界面显得混乱，不利于操作。这时可以单击面板右上角的按钮将其折叠，如图2-10所示。面板缩小后，即可将其排列到一起形成浮动面板组，如图2-11所示。
图2-10 图2-11
这些浮动面板被集合到面板组中，每个面板都可以展开或折叠，并且可以和其他面板停靠在一起或取消停靠。面板组还可以停靠到集成的应用程序窗口中，这样就能够很容易地访问所需的面板，而不会导致工作区变得混乱。
2.2 Dreamweaver 工作流程
Dreamweaver的工作流程一般包括创建与管理站点、在网页中创建文本、使用图像与多媒体丰富网页内容、在网页中添加超级链接、使用表格布局页面、应用CSS样式美化网页、应用CSS Div布局网页、使用框架布局网页、利用模板和库创建网页、使用JavaScript行为创建动态效果、站点的发布与推广等步骤。
2.3 使用可视化助理布局
可视化助理布局包括使用标尺和设置网格，可以更加准确地制作出精美的网页。本节将详细介绍使用可视化助理布局方面的知识。
2.3.1
使用标尺
在制作网页时，为了更加精确地把握插入页面的各元素的位置，可以使用标尺功能。下面详细介绍使用标尺的操作方法。
启动Dreamweaver CC程序，1. 在菜单栏中选择【查看】菜单，2. 在弹出的菜单中选择【标尺】菜单项，3. 在弹出的子菜单中选择【显示】菜单项，如图2-12所示。
通过以上步骤即可完成显示标尺的操作，如图2-13所示。
图2-12 图2-13
在标尺的左上角单击，然后拖至视图中的适当位置，释放鼠标，即可完成设置标尺新原点的操作，如图2-14所示。
图2-14
如果要恢复标尺的初始位置，可以在窗口左上角标尺交点处双击，或者在菜单栏中1. 选择【查看】菜单，2. 在弹出的菜单中选择【标尺】菜单项，3. 在弹出的子菜单中选择【重设原点】菜单项，如图2-15所示。
通过以上步骤即可完成恢复标尺初始位置的操作，如图2-16所示。
图2-15 图2-16
如果要更改度量单位，1. 在菜单栏中选择【查看】菜单，2. 在弹出的菜单中选择【标尺】菜单项，3. 在子菜单中选择【像素】、【英寸】或【厘米】菜单项，如图2-17所示。
图2-17
2.3.2
设置网格
利用网格命令，可以在【设计】视图中对层进行绘制、定位或调整大小，还可以对齐页面中的元素。下面详细介绍设置网格的操作方法。
启动Dreamweaver CC程序，1. 在菜单栏中选择【查看】菜单，2. 在弹出的菜单中选择【网格设置】菜单项，3. 在弹出的子菜单中选择【显示网格】菜单项，如图2-18所示。
通过以上步骤即可完成显示网格的操作，如图2-19所示。
图2-18 图2-19
如果要设置网格，如网格的颜色、间隔和显示方式等，1. 在菜单栏中选择【查看】菜单，2. 在弹出的菜单中选择【网格设置】菜单项，3. 在弹出的子菜单中选择【网格设置】菜单项，如图2-20所示。
弹出【网格设置】对话框，1. 在【颜色】区域设置颜色，2. 勾选【显示网格】和【靠齐到网格】复选框，3. 在【显示】区域选中【线】单选按钮，4. 单击【确定】按钮，如图2-21所示。
图2-20 图2-21
通过以上步骤即可完成设置网格的操作，如图2-22所示。
图2-22
【网格设置】对话框中各参数的具体作用如下。
> 【颜色】：可以在该文本框中输入网格线的颜色，或者单击【颜色框】按钮，打开调色板选择网格线的颜色。
> 【显示网格】：选中该复选框，可以显示网格线。
> 【靠齐到网格】：选中该复选框，可以在移动对象时自动捕捉网格。
> 【间隔】：可以在文本框中输入网格之间的间距，在右边的下拉列表框中选择网格单位，从中可以选择【像素】、【英寸】和【厘米】等选项。
> 【显示】：选中【线】单选按钮，网格线以直线方式显示；选中【点】单选按钮，网格线以点线方式显示。
2.4 实践案例与上机指导
通过本章的学习，用户基本可以了解Dreamweaver CC工作界面以及一些常见的操作方法。下面通过练习操作，达到巩固学习、拓展提高的目的。
2.4.1
使用辅助线
在Dreamweaver CC中，辅助线可以在创建网页时用于辅助的定位。下面详细介绍使用辅助线的操作方法。
启动Dreamweaver CC程序，1. 在菜单栏中选择【查看】菜单，2. 在弹出的下拉菜单中选择【辅助线】菜单项，3. 在弹出的子菜单中选择【显示辅助线】菜单项，如图2-23所示。
图2-23
1. 在菜单栏中选择【查看】菜单，2. 在弹出的菜单中选择【标尺】菜单项，3. 在弹出的子菜单中选择【显示】菜单项，如图2-24所示。
在左侧的标尺上单击并拖动，或在上侧的标尺上单击并拖动，即可拖曳出辅助线，如图2-25所示。
图2-24 图2-25
在Dreamweaver CC中，还可以对辅助线的属性进行设置。只需在菜单栏中选择【查看】菜单，在弹出的下拉菜单中选择【辅助线】菜单项，在子菜单中选择【编辑辅助线】菜单项，即可弹出【辅助线】对话框，从中可以对辅助线的属性进行设置，如图2-26所示。
图2-26
【辅助线】对话框中主要选项功能如下。
> 【辅助线颜色】：可以设置辅助线颜色。
> 【距离颜色】：指定鼠标保持在辅助线之间时作为距离指示器出现的线条的颜色。
> 【显示辅助线】：选中该复选框，可以使辅助线在【设计】视图中可见。
> 【靠齐辅助线】：使在窗口中移动的对象能够靠齐辅助线。
2.4.2
使用跟踪图像功能
用户在制作网页时，还可以使用图像跟踪功能。下面详细介绍使用图像跟踪功能的方法。
启动Dreamweaver CC程序，1. 在菜单栏中选择【查看】菜单，2. 在弹出的下拉菜单中选择【跟踪图像】菜单项，3. 在弹出的子菜单中选择【载入】菜单项，如图2-27所示。
弹出【选择图像源文件】对话框，1. 选择要载入图片的位置，2. 选中图片，3. 单击【确定】按钮，如图2-28所示。
图2-27 图2-28
通过以上步骤即可完成图像跟踪的操作，如图2-29所示。
图2-29
2.4.3
设置缩放比率
用户可以根据自身需要设置画面的缩放比率，下面详细介绍设置缩放比率的操作方法。
启动Dreamweaver CC程序，1. 在菜单栏中选择【查看】菜单，2. 在弹出的下拉菜单中选择【缩放比率】菜单项，3. 在弹出的子菜单中选择25%菜单项，如图2-30所示。
图片比例发生变化，如图2-31所示。
图2-30 图2-31
2.4.4
设置窗口大小
用户可以根据自身需要设置窗口大小，下面详细介绍设置窗口大小的操作方法。
启动Dreamweaver CC程序，1. 在菜单栏中选择【查看】菜单，2. 在弹出的下拉菜单中选择【窗口大小】菜单项，3. 在弹出的子菜单中选择【320×480智能手机】菜单项，如图2-32所示。
窗口大小发生变化，如图2-33所示。
图2-32 图2-33
2.5 思考与练习
一、填空题
1. 进入Dreamweaver
CC工作界面，其中包括 、 、【插入】面板、 、【属性】面板和 6个部分。
2. Dreamweaver CC界面默认打开的面板有 面板、 面板以及 面板(也称属性检查器)。
3. Dreamweaver的工作流程一般包括创建与管理站点、 、使用图像与多媒体丰富网页内容、 、使用表格布局页面、 、应用CSS Div布局网页、 、利用模板和库创建网页、 、站点的发布与推广等步骤。
4. Dreamweaver CC的 ，主要用于查看和更改所选择对象的各种属性。其中包含两个选项，即 选项和 选项。
5. 在【插入】面板中包括 、【结构】、 、【表单】、 、jQuery UI、 和【收藏夹】8个选项。
二、判断题
1. 单击【在浏览器中预览/调试】按钮，从弹出的下拉菜单中选择一个浏览器，可以在浏览器中预览或调试文档。 ( )
2. 在网页中插入的电子邮件链接的方法是在【文本】文本框中输入E-mail地址或其他文字信息，然后在E-mail文本框中输入准确的邮件地址，就可以自动插入邮件地址发送链接。 ( )
3. 使用属性检查器，可以检查和编辑当前页面选定元素的常用属性，如文本和插入的对象。属性检查器的内容根据选定元素的不同不会有变化。 ( )
4. 浮动面板被集合到面板组中，每个面板都可以展开或折叠，并且可以和其他面板停靠在一起或取消停靠。面板组还可以停靠到集成的应用程序窗口中。 ( )
三、思考题
1. 如何在Dreamweaver
CC中使用辅助线？
2. 如何在Dreamweaver
CC中使用跟踪图像功能？
评论
还没有评论。