Dreamweaver8-chs教程 第1章_认识Dreamwaver
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
1.18
© 2007
1.9
© 2007
第1章
认识 Dreamweaver 8
利用XML数据进行可视化创作 数据进行可视化创作 利用
XML文件的基本结构： XML文件的基本结构： 文件的基本结构
• • • • • • • • • • • • • <xml version="1.0"> <mybooks> <book bookid="1"> <pubdate>03/01/2004</pubdate> <title>Displaying XML Data with Macromedia Dreamweaver</title> <author>Charles Brown</author> </book> <book bookid="2"> <pubdate>04/08/2004</pubdate> <title>Understanding XML</title> <author>John Thompson</author> </book> </mybooks> 每一个<book>父标签都包含三个子标签：<pubdate>、<title>和<author>。 每一个<book>父标签都包含三个子标签：<pubdate>、<title>和<author>。 父标签都包含三个子标签 但每个<book>标签也是 标签也是<mybooks>标签的子标签 标签的子标签， 但每个<book>标签也是<mybooks>标签的子标签，后者在架构中的级别比前 者高一级。只要相应地将标签嵌套在其他标签中， 者高一级。只要相应地将标签嵌套在其他标签中，并为每个开始标签指定一 个对应的结束标签，就可以随意命名XML标签并安排它们的结构 标签并安排它们的结构。 个对应的结束标签，就可以随意命名XML标签并安排它们的结构。
1.6
© 2007
第1章
认识 Dreamweaver 8
缩放工具
功 能： • 放大并检查图像，使用复杂的嵌 放大并检查图像， 套表格布局 II. 缩小可预览页面的显示方式
缩放工具
1.7
© 2007
第1章
认识 Dreamweaver 8
辅助线
功能： 功能： I. 测量页面布局， 测量页面布局，将页 面布局和页面模型加 以比较， 以比较，精度可达像 素级别 可视化反馈有助于准 确地测量距离， 确地测量距离，并且 支持智能靠齐
代码折叠
1.14
© 2007
第1章
认识 Dreamweaver 8
编码工具栏
新的“编码”工具栏在“代码” 新的“编码”工具栏在“代码”视图一侧的沟槽栏中提供了用于常见 编码功能的按钮
要了解每个按钮的功 能，请将鼠标指针定 位于按钮上直至出现 工具提示
编码工具栏
1.15
© 2007
第1章
认识 Dreamweaver 8
1.3
© 2007
第1章
认识 Dreamweaver 8
本章内容
Dreamweaver 8概述 8概述 Dreamweaver 8的新功能 8的新功能
1.4
© 2007
第1章
认识 Dreamweaver 8
Dreamweaver 8概述 概述
1.1 Dreamweaver 8概述 8概述
2005年8月, 美国 Macromedia公司推出了Dreamweaver 8 年 月 Macromedia公司推出了Dreamweaver Dreamweaver是目前主流的网页设计工具，不仅具有强大的 Dreamweaver是目前主流的网页设计工具，不仅具有强大的 页面 设计功能，而且具有完善的站点管理能力，使用Dreamweaver设计网 设计功能，而且具有完善的站点管理能力，使用Dreamweaver设计网 页将是一个便捷、高效的工作流程 Dreamweaver 8结合了Dreamweaver 的可视化排版功能，融合了 8结合了Dreamweaver Dreamweaver UltraDev的动态数据库页面开发功能和HomeSite的强大 UltraDev的动态数据库页面开发功能和HomeSite的强大 的代码编辑支持
在文件传输期间无法执行的与服务器相关的活动包括： 在文件传输期间无法执行的与服务器相关的活动包括： 上传/获取 存回/取出文件 获取/存回 取出文件。 上传 获取 存回 取出文件。 撤消取出。 撤消取出。 创建数据库连接。 创建数据库连接。 绑定动态数据。 绑定动态数据。 预览动态数据。 预览动态数据。 服务。 插入 Web 服务。 删除远端文件或文件夹。 删除远端文件或文件夹。 在测试服务器上的浏览器中预览。 在测试服务器上的浏览器中预览。 将文件保存到远程服务器。 将文件保存到远程服务器。 从远程服务器插入图像。 从远程服务器插入图像。 从远程服务器打开文件。 从远程服务器打开文件。 在保存时自动上传文件。 在保存时自动上传文件。 将文件拖动到远端站点。 将文件拖动到远端站点。 剪切、复制或粘贴远端站点上的文件。 剪切、复制或粘贴远端站点上的文件。 刷新“远程”视图。 刷新“远程”视图。
第1章
认识 Dreamweaver 8
Dreamweaver 8中文版 8中文版 实用教程
颜辉 主编
中国水利水电出版社
1.1
© 2007
第1章 认识Dreamweaver 认识Dreamweaver 8
第1章
认识 Dreamweaver 8
本章内容
• 了解Dreamweaver及其基本特点 了解Dreamweaver及其基本特点 • 了解Dreamweaver 8的新功能 了解Dreamweaver 8的新功能
1.5
© 2007
第1章
认识 Dreamweaver 8
Dreamweaver 8的新功能 的新功能
பைடு நூலகம்
1.2 Dreamweaver 8的新功能 8的新功能
缩放工具和辅助线 利用XML数据进行可视化创作 利用XML数据进行可视化创作 新的“CSS样式”面板 样式” 新的“CSS样式 CSS布局的可视化 CSS布局的可视化 代码折叠 编码工具栏 后台文件传输 “插入Flash视频”命令 插入Flash视频 视频”
1.17
© 2007
第1章
认识 Dreamweaver 8
插入Flash视频”命令 视频” “插入 视频
I. II. 轻松地在Web页中插入Flash视频内容，无需使用Flash创作工具； 插入Flash视频组件后，在浏览器中查看该组件时，将显示用户选 择的 Flash视频内容以及一组播放控件
插入Flash视频
II.
辅 助 线
1.8
© 2007
第1章
认识 Dreamweaver 8
利用XML数据进行可视化创作 数据进行可视化创作 利用
功能： 功能： I. 快速利用XML将源集成到工作中，并揭开XML到HTML转换 将源集成到工作中， 的神秘面纱； 的神秘面纱； II. 使用简单的拖放工作流程，可将基于XML的数据（如RSS源） 使用简单的拖放工作流程， 的数据（ 页中； 集成到Web页中； III. 使用改善的XML和XSLT代码提示功能，可跳转到“代码”视 代码提示功能，可跳转到“代码” 图来自定义转换 。
编码工具栏
默认情况下编码工具栏中将显示以下按钮： 默认情况下编码工具栏中将显示以下按钮： 打开的文档：列出已打开的文档。选择一个文档后，它将显示在“文档” 打开的文档：列出已打开的文档。选择一个文档后，它将显示在“文档”窗口 中。 折叠整个标签：折叠位于一组开始和结束标签之间的内容。 折叠整个标签：折叠位于一组开始和结束标签之间的内容。 折叠所选：折叠所选代码。 折叠所选：折叠所选代码。 扩展全部：可还原所有折叠的代码。 扩展全部：可还原所有折叠的代码。 选择父标签：可选择放置了插入点的那一行的内容及其两侧的开始和结束标签。 选择父标签：可选择放置了插入点的那一行的内容及其两侧的开始和结束标签。 平衡大括弧：选择放置插入点的那一行的内容及其两侧的圆括号、 平衡大括弧：选择放置插入点的那一行的内容及其两侧的圆括号、大括弧或方 括号。 括号。 显示行号：可以在每个代码行的行首隐藏或显示号码。 显示行号：可以在每个代码行的行首隐藏或显示号码。 高亮显示无效代码：将以黄色高亮显示无效的代码。 高亮显示无效代码：将以黄色高亮显示无效的代码。 应用注释：可以在所选代码两侧添加注释标签或打开新的注释标签。 应用注释：可以在所选代码两侧添加注释标签或打开新的注释标签。 删除注释：除所选代码的注释标签。 删除注释：除所选代码的注释标签。 环绕标签：在所选代码两侧添加选自“快速标签编辑器”的标签。 环绕标签：在所选代码两侧添加选自“快速标签编辑器”的标签。 最近的代码片断：可以从“代码片断”面板中插入最近使用过的代码片断。 最近的代码片断：可以从“代码片断”面板中插入最近使用过的代码片断。 缩进代码：将选定内容向左移动。 缩进代码：将选定内容向左移动。
II.
III. 使用“CSS样式”面板还可以在“ 样式”面板还可以在“ 使用“ 全部” 正在” 全部”和“正在”模式下修改CSS 属性
“正在”模式下的 “CSS样式”面板
1.12
“全部”模式 下的“CSS样式” 面板
© 2007
第1章
认识 Dreamweaver 8
CSS布局的可视化 布局的可视化
1.10
© 2007
第1章
认识 Dreamweaver 8
新的“ 样式” 新的“CSS样式”面板 样式
功能创新： 功能创新： • • • 全部CSS功能已合并到一个面板集合中，并已得到增强，可以更 功能已合并到一个面板集合中，并已得到增强， 加轻松、 样式； 加轻松、更有效率地使用CSS样式； 使用新的界面可以更方便地看到应用于具体元素的样式层叠， 使用新的界面可以更方便地看到应用于具体元素的样式层叠，从 而能够轻松地确定在何处定义了属性； 而能够轻松地确定在何处定义了属性； 属性网格允许进行快速编辑。 属性网格允许进行快速编辑。
1.11
© 2007
第1章
认识 Dreamweaver 8
新的“ 样式” 新的“CSS样式”面板 样式
I. 使用“CSS样式”面板可以跟踪影 样式” 使用“ 响当前所选页面元素（ 正在” 响当前所选页面元素（“正在”模 规则和属性， 式）的CSS规则和属性，或影响整 个文档的规则和属性（ 全部” 个文档的规则和属性（“全部”模 式）； 使用“CSS样式”面板顶部的切换 样式” 使用“ 按钮可以在两种模式之间切换； 按钮可以在两种模式之间切换；
1.16
© 2007
第1章
认识 Dreamweaver 8
后台文件传输
可以在获取或上传文件期间执行其他与服务器无关的活动。背景文件传输 可以在获取或上传文件期间执行其他与服务器无关的活动。 对于Dreamweaver所支持的所有传输协议都适用：FTP、 SFTP、LAN、 所支持的所有传输协议都适用： 对于 所支持的所有传输协议都适用 、 、 、 WebDAV、Microsoft Visual SourceSafe和RDS。 、 和 。
I. II.
应用可视化助理来描画CSS布局 边框或为CSS布局加上颜色； 布局加上颜色； 应用可视化助理可揭示出复杂 的嵌套方案，并改善所选内容 的嵌套方案，
“可视化助理”菜单
1.13
© 2007
第1章
认识 Dreamweaver 8
代码折叠
通过隐藏和展开代码块， 通过隐藏和展开代码块，重点显示想要查看的代码
© 2007
1.9
© 2007
第1章
认识 Dreamweaver 8
利用XML数据进行可视化创作 数据进行可视化创作 利用
XML文件的基本结构： XML文件的基本结构： 文件的基本结构
• • • • • • • • • • • • • <xml version="1.0"> <mybooks> <book bookid="1"> <pubdate>03/01/2004</pubdate> <title>Displaying XML Data with Macromedia Dreamweaver</title> <author>Charles Brown</author> </book> <book bookid="2"> <pubdate>04/08/2004</pubdate> <title>Understanding XML</title> <author>John Thompson</author> </book> </mybooks> 每一个<book>父标签都包含三个子标签：<pubdate>、<title>和<author>。 每一个<book>父标签都包含三个子标签：<pubdate>、<title>和<author>。 父标签都包含三个子标签 但每个<book>标签也是 标签也是<mybooks>标签的子标签 标签的子标签， 但每个<book>标签也是<mybooks>标签的子标签，后者在架构中的级别比前 者高一级。只要相应地将标签嵌套在其他标签中， 者高一级。只要相应地将标签嵌套在其他标签中，并为每个开始标签指定一 个对应的结束标签，就可以随意命名XML标签并安排它们的结构 标签并安排它们的结构。 个对应的结束标签，就可以随意命名XML标签并安排它们的结构。
1.6
© 2007
第1章
认识 Dreamweaver 8
缩放工具
功 能： • 放大并检查图像，使用复杂的嵌 放大并检查图像， 套表格布局 II. 缩小可预览页面的显示方式
缩放工具
1.7
© 2007
第1章
认识 Dreamweaver 8
辅助线
功能： 功能： I. 测量页面布局， 测量页面布局，将页 面布局和页面模型加 以比较， 以比较，精度可达像 素级别 可视化反馈有助于准 确地测量距离， 确地测量距离，并且 支持智能靠齐
代码折叠
1.14
© 2007
第1章
认识 Dreamweaver 8
编码工具栏
新的“编码”工具栏在“代码” 新的“编码”工具栏在“代码”视图一侧的沟槽栏中提供了用于常见 编码功能的按钮
要了解每个按钮的功 能，请将鼠标指针定 位于按钮上直至出现 工具提示
编码工具栏
1.15
© 2007
第1章
认识 Dreamweaver 8
1.3
© 2007
第1章
认识 Dreamweaver 8
本章内容
Dreamweaver 8概述 8概述 Dreamweaver 8的新功能 8的新功能
1.4
© 2007
第1章
认识 Dreamweaver 8
Dreamweaver 8概述 概述
1.1 Dreamweaver 8概述 8概述
2005年8月, 美国 Macromedia公司推出了Dreamweaver 8 年 月 Macromedia公司推出了Dreamweaver Dreamweaver是目前主流的网页设计工具，不仅具有强大的 Dreamweaver是目前主流的网页设计工具，不仅具有强大的 页面 设计功能，而且具有完善的站点管理能力，使用Dreamweaver设计网 设计功能，而且具有完善的站点管理能力，使用Dreamweaver设计网 页将是一个便捷、高效的工作流程 Dreamweaver 8结合了Dreamweaver 的可视化排版功能，融合了 8结合了Dreamweaver Dreamweaver UltraDev的动态数据库页面开发功能和HomeSite的强大 UltraDev的动态数据库页面开发功能和HomeSite的强大 的代码编辑支持
在文件传输期间无法执行的与服务器相关的活动包括： 在文件传输期间无法执行的与服务器相关的活动包括： 上传/获取 存回/取出文件 获取/存回 取出文件。 上传 获取 存回 取出文件。 撤消取出。 撤消取出。 创建数据库连接。 创建数据库连接。 绑定动态数据。 绑定动态数据。 预览动态数据。 预览动态数据。 服务。 插入 Web 服务。 删除远端文件或文件夹。 删除远端文件或文件夹。 在测试服务器上的浏览器中预览。 在测试服务器上的浏览器中预览。 将文件保存到远程服务器。 将文件保存到远程服务器。 从远程服务器插入图像。 从远程服务器插入图像。 从远程服务器打开文件。 从远程服务器打开文件。 在保存时自动上传文件。 在保存时自动上传文件。 将文件拖动到远端站点。 将文件拖动到远端站点。 剪切、复制或粘贴远端站点上的文件。 剪切、复制或粘贴远端站点上的文件。 刷新“远程”视图。 刷新“远程”视图。
第1章
认识 Dreamweaver 8
Dreamweaver 8中文版 8中文版 实用教程
颜辉 主编
中国水利水电出版社
1.1
© 2007
第1章 认识Dreamweaver 认识Dreamweaver 8
第1章
认识 Dreamweaver 8
本章内容
• 了解Dreamweaver及其基本特点 了解Dreamweaver及其基本特点 • 了解Dreamweaver 8的新功能 了解Dreamweaver 8的新功能
1.5
© 2007
第1章
认识 Dreamweaver 8
Dreamweaver 8的新功能 的新功能
பைடு நூலகம்
1.2 Dreamweaver 8的新功能 8的新功能
缩放工具和辅助线 利用XML数据进行可视化创作 利用XML数据进行可视化创作 新的“CSS样式”面板 样式” 新的“CSS样式 CSS布局的可视化 CSS布局的可视化 代码折叠 编码工具栏 后台文件传输 “插入Flash视频”命令 插入Flash视频 视频”
1.17
© 2007
第1章
认识 Dreamweaver 8
插入Flash视频”命令 视频” “插入 视频
I. II. 轻松地在Web页中插入Flash视频内容，无需使用Flash创作工具； 插入Flash视频组件后，在浏览器中查看该组件时，将显示用户选 择的 Flash视频内容以及一组播放控件
插入Flash视频
II.
辅 助 线
1.8
© 2007
第1章
认识 Dreamweaver 8
利用XML数据进行可视化创作 数据进行可视化创作 利用
功能： 功能： I. 快速利用XML将源集成到工作中，并揭开XML到HTML转换 将源集成到工作中， 的神秘面纱； 的神秘面纱； II. 使用简单的拖放工作流程，可将基于XML的数据（如RSS源） 使用简单的拖放工作流程， 的数据（ 页中； 集成到Web页中； III. 使用改善的XML和XSLT代码提示功能，可跳转到“代码”视 代码提示功能，可跳转到“代码” 图来自定义转换 。
编码工具栏
默认情况下编码工具栏中将显示以下按钮： 默认情况下编码工具栏中将显示以下按钮： 打开的文档：列出已打开的文档。选择一个文档后，它将显示在“文档” 打开的文档：列出已打开的文档。选择一个文档后，它将显示在“文档”窗口 中。 折叠整个标签：折叠位于一组开始和结束标签之间的内容。 折叠整个标签：折叠位于一组开始和结束标签之间的内容。 折叠所选：折叠所选代码。 折叠所选：折叠所选代码。 扩展全部：可还原所有折叠的代码。 扩展全部：可还原所有折叠的代码。 选择父标签：可选择放置了插入点的那一行的内容及其两侧的开始和结束标签。 选择父标签：可选择放置了插入点的那一行的内容及其两侧的开始和结束标签。 平衡大括弧：选择放置插入点的那一行的内容及其两侧的圆括号、 平衡大括弧：选择放置插入点的那一行的内容及其两侧的圆括号、大括弧或方 括号。 括号。 显示行号：可以在每个代码行的行首隐藏或显示号码。 显示行号：可以在每个代码行的行首隐藏或显示号码。 高亮显示无效代码：将以黄色高亮显示无效的代码。 高亮显示无效代码：将以黄色高亮显示无效的代码。 应用注释：可以在所选代码两侧添加注释标签或打开新的注释标签。 应用注释：可以在所选代码两侧添加注释标签或打开新的注释标签。 删除注释：除所选代码的注释标签。 删除注释：除所选代码的注释标签。 环绕标签：在所选代码两侧添加选自“快速标签编辑器”的标签。 环绕标签：在所选代码两侧添加选自“快速标签编辑器”的标签。 最近的代码片断：可以从“代码片断”面板中插入最近使用过的代码片断。 最近的代码片断：可以从“代码片断”面板中插入最近使用过的代码片断。 缩进代码：将选定内容向左移动。 缩进代码：将选定内容向左移动。
II.
III. 使用“CSS样式”面板还可以在“ 样式”面板还可以在“ 使用“ 全部” 正在” 全部”和“正在”模式下修改CSS 属性
“正在”模式下的 “CSS样式”面板
1.12
“全部”模式 下的“CSS样式” 面板
© 2007
第1章
认识 Dreamweaver 8
CSS布局的可视化 布局的可视化
1.10
© 2007
第1章
认识 Dreamweaver 8
新的“ 样式” 新的“CSS样式”面板 样式
功能创新： 功能创新： • • • 全部CSS功能已合并到一个面板集合中，并已得到增强，可以更 功能已合并到一个面板集合中，并已得到增强， 加轻松、 样式； 加轻松、更有效率地使用CSS样式； 使用新的界面可以更方便地看到应用于具体元素的样式层叠， 使用新的界面可以更方便地看到应用于具体元素的样式层叠，从 而能够轻松地确定在何处定义了属性； 而能够轻松地确定在何处定义了属性； 属性网格允许进行快速编辑。 属性网格允许进行快速编辑。
1.11
© 2007
第1章
认识 Dreamweaver 8
新的“ 样式” 新的“CSS样式”面板 样式
I. 使用“CSS样式”面板可以跟踪影 样式” 使用“ 响当前所选页面元素（ 正在” 响当前所选页面元素（“正在”模 规则和属性， 式）的CSS规则和属性，或影响整 个文档的规则和属性（ 全部” 个文档的规则和属性（“全部”模 式）； 使用“CSS样式”面板顶部的切换 样式” 使用“ 按钮可以在两种模式之间切换； 按钮可以在两种模式之间切换；
1.16
© 2007
第1章
认识 Dreamweaver 8
后台文件传输
可以在获取或上传文件期间执行其他与服务器无关的活动。背景文件传输 可以在获取或上传文件期间执行其他与服务器无关的活动。 对于Dreamweaver所支持的所有传输协议都适用：FTP、 SFTP、LAN、 所支持的所有传输协议都适用： 对于 所支持的所有传输协议都适用 、 、 、 WebDAV、Microsoft Visual SourceSafe和RDS。 、 和 。
I. II.
应用可视化助理来描画CSS布局 边框或为CSS布局加上颜色； 布局加上颜色； 应用可视化助理可揭示出复杂 的嵌套方案，并改善所选内容 的嵌套方案，
“可视化助理”菜单
1.13
© 2007
第1章
认识 Dreamweaver 8
代码折叠
通过隐藏和展开代码块， 通过隐藏和展开代码块，重点显示想要查看的代码