第13章 Dreamweaver CS6动态网页设计基础..
Dreamweaver CS6网页设计与制作教学教案
《Dreamweaver CS6网页设计与制作标准教程》教学教案掌握互联网基础和网站建设基本流程。
掌握网站建设基础和网页设计基础。
掌握网页的制作常用软件和标准技术。
熟练掌握网站建设的基本流程。
熟练掌握网页设计基础知识。
软件的应用和标准技术。
掌握软件的工作界面和创建网站框架。
掌握管理站点文件和文件夹的方法。
掌握管理站点和网页文件头设置。
熟练掌握Dreamweaver CS6工作界面的基本操作。
熟练掌握Dreamweaver CS6的站点。
在Dreamweaver CS6中站点的建立及编辑。
第3讲掌握输入文本和设置文本属性的方法。
掌握项目符号和编号列表的创建方法。
掌握水平线、网格与标尺的使用方法。
熟练掌握文本的多种创建方法和编辑技巧。
熟练掌握项目符号、编号列表和水平线的使用方法。
能够正确输入文本并编辑相关属性。
3.1.14 设置文本样式3.1.15 段落文本3.2 项目符号和编号列表3.2.1 课堂案例——电器城网店3.2.2 设置项目符号或编号3.2.3 修改项目符号或编号3.2.4 设置文本缩进格式3.2.5 插入日期3.2.6 特殊字符3.2.7 插入换行符3.3 水平线、网格与标尺3.3.1 课堂案例——摄影艺术网页3.3.2 水平线3.3.3 显示和隐藏网格3.3.4 标尺3.4 课堂练习——有机果蔬网页3.5 课后习题——休闲旅游网页小结1、熟练掌握文本的使用方法和技巧。
2、了解并掌握项目符号和编辑列表的使用方法和技巧。
作业第4讲熟练掌握图像的插入方法。
掌握多媒体在网页中的应用。
熟练掌握图像的格式与模式。
熟练掌握Flash文件的插入与设置。
能够正确使用图像和图像的属性设置、Flash文件的格式及设置属性。
4.4 课后习题——房源网页小结1、熟练掌握图像的格式与插入方法和使用技巧。
2、掌握Flash动画的插入和属性的设置。
作业第5讲了解超链接的概念与路径知识。
掌握文本、图像超链接的创建方法。
Dreamweaver CS6网页设计与制作标准教程 (13)
13.2.1 婚戒网页
使用“打开浏览器窗口”命令，制作在网页中显示指定大小
的弹出窗口。
效果图
13.2.2 调用 JavaScript
“调用 JavaScript”动作的功能是当发生某个事件时选择自 定义函数或 JavaScript代码行。
13.2.3 打开浏览器窗口
使用“打开浏览器窗口”动作在一个新的窗口中打开指定的 URL，还可以指定新窗口的属性、特征和名称。
效果图
13.4 课后习题——美味蛋糕网页
使用“设置状态栏文本”命令，设置在加载网页文档时在状 态栏中显示的文字。
效果图
“检查插件”对话框
13.2.7 检查表单
“检查表单”动作的功能是检查指定文本域的内容以确保用
户输入了正确的数据类型。若使用 onBlur 事件将“检查表单”动 作分别附加到各文本域，则在用户填写表单时对域进行检查。若使
用 onSubmit 事件将“检查表单”动作附加到表单，则在用户单
击“提交”按钮时，同时对多个文本域进行检查。将“检查表单” 动作附加到表单，能防止将表单中任何指定文本域内的无效数据提 交到服务器。
13.2.14 设置状态栏文本
“设置状态栏文本”动作的功能是设置在浏览器窗口底部左 侧的状态栏中显示的消息。访问者常常会忽略或注意不到状态栏中 的消息，如果消息非常重要，还是考虑将其显示为弹出式消息或层 文本。可以在文本中嵌入任何有效的 JavaScript 函数调用、属性、 全局变量或其他表达式。若要嵌入一个 JavaScript 表达式，需将
“设置容器的文本”对话框
13.2.12 设置文本域文字
“设置文本域文字”动作的功能是用指定的内容替换表单文 本域的内容。可以在文本中嵌入任何有效的 JavaScript 函数调用、 属性、全局变量或其他表达式。若要嵌入一个 JavaScript 表达式， 将其放置在大括号 ({}) 中。若要显示大括号，在它前面加一个反斜 杠（\{}） 。
dreamweavercs6教案
dreamweavercs6教案一、网页设计基础与制作流程在网络高速发展的今天，网站已经成为一个自我展示和宣传的平台，一个网站是由多个相关联的网页构成的。
一般网页上都会有文本和图像信息，复杂一些的网页上还会有声音、视频、动画、多媒体。
要制作出精美的网页，不仅需要能够熟练的使用软件，还需要掌握一些网页制作的相关知识。
现在我们常用的浏览器有IE,火狐，欧朋，谷歌，搜狗，360，遨游，百度浏览器，hao123浏览器，腾讯TT。
这些国产的浏览器大部分是以IE为内核的。
因为浏览器的内核不同，所以同样的代码在浏览器上的显示可能不一样。
如果制作页面的话，我建议用火狐或者IE。
二、Dreamweaver简介Dreamweaver CS是一款由Adobe公司大力开发的专业HTML编辑器，用于对WEB站点，WEB页面和WEB应用程序进行设计、编码和开发。
利用Dreamweaver中的可视化编辑功能，用户可以快速创建页面而无须编写任何代码。
三、表格的基本应用表格是页面的重要元素，在DIV+CSS布局方式被广泛运用之前，表格布局在很长一段时间中都是最重要的页面布局方式。
在使用DIV+CSS布局中，也并不是完全不可以使用表格，而是将表格回归他本身的作用，用于显示表格式数据。
现在在一些的系统中，无论是后台使用java或是c#做的，在页面显示数据大部分使用到表格。
这里的表格就类似于Excel表格，并且在项目中，通常可以使用表格导出Excel表或者是实现导入Excel表，这样在办公方面增加了用户体验。
插入表格及设置表格属性1、单击“插入”面板的“表格”按钮，弹出“表格”对话框，在该表格对话框中可以设置表格的行数、列数、表格的宽度、单元格间距、单元格边距、边框粗细等选项。
表格宽度：该选项用于设置表格的宽度，“宽度”的单位可以通过右边的下拉列表选择。
如果以百分比定义的表格，会随着浏览器窗口大小的改变而改变。
单元格边距：用于设置插入的表格中单元格内容和单元格之间的边框数。
《网页设计与制作Dreamweaver CS6》电子教案
XXX中等职业学校教案
适用年级： XXX 课程名称：网页设计与制作 Dreamweaver CS6 任课教师： XXX
XXXX学校计算机专业组制
第1-4课时讲授2学时实践2学时
第5-10课时讲授2学时实践4学时
第11-16课时讲授2学时实践4学时
第16-21课时讲授2学时实践4学时
第22--27课时讲授2学时实践4学时
第28-37课时讲授4学时实践6学时
第38--41课时讲授2学时实践2学时
第41--50课时讲授4学时实践6学时
第51--56课时讲授2学时实践4学时
第57--60课时讲授2学时实践2学时
第61--68课时讲授4学时实践4学时
第69--74课时讲授2学时实践4学时
第75--80课时讲授2学时实践4学时
第81--90课时讲授4学时实践6学时
第91--94课时讲授2学时实践2学时。
Dreamweaver网页制作课件教案13章 动态网页基础
成功安装IIS之后，Web站点默认的主目录是：系统安装盘符:\inetpub\wwwroot。用户 也可以将主目录设置为本地计算机上的其他目录，还可以设置为局域网上其他计算机的目录， 或者重定向到其他网址。只需在“连接到资源时的内容来源”区域选中需要的内容来源，然
注意：虚拟目录的别名不区分大小写，并且应唯一。
设置文件夹的共享属性
在资源管理器中，在要设置为虚拟目录的文件夹上单击鼠标右健，从弹出的快捷 菜单中选择“属性”命令，打开“Web共享”选项卡。
13.5 制作动态网页的步骤
新建一个动态页面，并使用Dreamweaver提供的设计工具创建页面的框架和 布局。
13.7 定义数据源
在一个站点中可能不止一个数据库。一个数据库中又往往包含多个结构不同的数 据表。因此，将动态内容添加到页面中之前，必须定义一个数据源来提供动态内容。
数据源可以是记录集中的一个域，表单的提交值，或者是类似会话变量或应用程 序变量的服务器对象。
定义记录集 定义变量 ➢ 定义请求变量 ➢ 定义阶段变量 ➢ 定义应用程序变量
13.8 绑定动态数据
打开“绑定”面板，选中记录集中需要的字段，并拖入文档相应位置；或单 击绑定窗口右下角的“插入”按钮。
13.9 设置实时视图
Dreamweaver的实时数据编辑环境能够让网页设计人员在编辑环境中实时预 览可编辑数据的Web应用，这样可以有效地提高工作效率，减少重复劳动。 1．在Dreamweaver的文档窗口顶部空白区域单击鼠标右键，在弹出的快捷菜单中 选择“浏览器导航”命令，在文档窗口顶部显示浏览器导航栏，如图所示。
Dreamweaver CS6网页设计与制作标准教程教学大纲教案
《Dreamweaver CS6网页设计与制作标准教程》教学大纲教案课程介绍：本课程是一门概念性和实践性都很强的面向实际应用的课程。
Dreamweaver CS6是由Adobe公司开发的网页设计与制作软件。
Adobe公司在Dreamweaver这一软件的版本上不断升级，是为了使广大从事网页制作和网页设计工作的用户拥有性能更完善的得力工具，同时也是为了使刚刚步入设计领域的初学者能够拥有更加优秀的学习软件。
本课程主要介绍的是Dreamweaver CC的基本操作方法和网页设计制作技巧，这是学习Dreamweaver的入门课程，也是必修课程，学员通过本课程的学习，应当能够熟悉软件功能和网页设计思路，为今后的专业学习或深入的设计打下基础。
培训目标：➢掌握网站建设基本流程和网页设计基础知识➢掌握Dreamweaver CC的工作界面和网站的建设基础➢掌握文本与文档的编辑➢熟练掌握插入图像和多媒体的方法和技巧➢掌握网页超链接的创建方法及应用技巧➢熟练掌握表格的使用方法及应用技巧➢熟练掌握框架集框架集的使用方法➢熟练掌握层的基本操作方法➢掌握层叠样式表（CSS）样式➢掌握模板和库的使用方法➢掌握CSS+DIV的布局方法及技巧➢掌握使用表单的方法➢了解行为的使用方法➢掌握网页代码的编写和修改➢掌握商业案例实训的设计方法及技巧培训内容：一、网页设计基础知识1、掌握互联网基础和网站建设基本流程2、掌握网站建设基础和网页设计基础3、掌握网页的制作常用软件和标准技术二、初识Dreamweaver CS61、掌握Dreamweaver CC的工作界面2、掌握站点管理器、创建文件夹、定义新站点、创建和保存网页3、掌握重命名、移动、删除文件和文件夹4、掌握站点的打开、编辑、复制、删除、导入和导出5、掌握关键字、作者和版权信息、刷新时间、描述信息等其他文件头的设置三、文本与文档1、掌握文字的输入、连续空格的输入2、掌握页边距、网页的标题、网页的默认格式的设置3、掌握对文字的大小、颜色、字体、对齐方式和段落样式等的设置4、掌握项目符号或编号、文本缩进、插入日期、特殊字符和换行符的使用5、掌握水平线、显示/隐藏网格和标尺的应用四、图像和多媒体1、掌握图像的格式2、掌握图像的插入、图像的属性、跟踪图像的应用3、掌握Flash动画、FLV、Shockwave影片、Applet程序、ActiveX控件的插入五、超链接1、掌握超链接的概念与路径知识2、掌握文本超链接、电子邮件超链接、下载文件链接的创建方法3、图片链接、鼠标经过图像链接的创建方法4、掌握锚点链接、热点链接的创建方法六、使用表格1、掌握表格的组成和插入方法2、掌握表格、单元格和行或列的属性设置3、掌握在单元格中输入文字、插入其他网页元素4、掌握选择整个表格、行或列、单元格的应用5、掌握复制、粘贴表格的应用6、掌握表格删除、缩放的应用7、掌握单元格的合并和单元格的拆分七、使用框架1、掌握框架与框架集的操作方法2、熟练掌握框架属性的设置方法八、使用层1、熟练掌握层的基本操作方法2、掌握应用层设计表格的技巧九、CSS样式1、掌握CSS样式的概念2、掌握CSS样式面板的使用方法3、掌握CSS样式选择器的应用4、掌握样式的类型和创建方法5、掌握CSS样式的属性十、模板和库1、掌握资源面板的使用方法2、掌握创建模板、可编辑区域、重复区域、重复表格的创建方法3、掌握模板的重命名、修改模板文件、更新站点和删除模板文件的方法4、掌握如何创建库文件5、掌握重命名、删除、修改和更新库项目的方法十一、CSS+DIV布局方法1、掌握CSS+DIV的概述2、掌握div和span标记的区别3、掌握盒子的概念和操作技巧十二、使用表单1、掌握表单的使用方法2、掌握单行、密码、多行和电子邮件文本域的创建方法3、掌握单选按钮、单选按钮组和复选框的创建方法4、掌握下拉菜单、滚动列表的创建方法5、掌握文件域、图像域和按钮的创建方法十三、使用行为1、掌握行为面板的使用2、掌握JavaScript、打开浏览器窗口和转到URL的创建方法3、掌握检查插件、检查表单和交换图像的创建方法4、掌握显示隐藏层的方法5、掌握容器的文本、状态栏文本和文本域文字的设置方法6、跳转菜单和跳转菜单开始的方法十四、网页代码1、掌握新建标签库、标签、属性的方法2、掌握常用HTML标签的使用3、掌握响应HTML事件的方法十五、商业案例实训1、掌握软件基础知识的使用方法2、了解软件的常用设计领域3、掌握在不同设计领域本书全面、系统地介绍Photoshop CC 2019的基本操作方法和图形图像处理技巧，并对Photoshop在设计领域的应用进行细致的讲解，具体内容包括图像制作基础、软件基础操作、插画设计、Banner设计、App设计、H5设计、海报设计、网页设计、包装设计、综合设计实训等。
1.Dreamweaver CS6 基础知识
H ：文档大小和下载时间
I ：编码指示器
7. 状态栏参数设置
为状态栏设置参数时，可以执行“编辑→首选参数”命令，打开“首选参数”对话框。在左 边的“分类”列表框中选择“窗口大小”选顷，在右边就会显示出状态栏的相关设置。
1.2 Dபைடு நூலகம்EAMWEAVER CS6 的工作界面
网页创建中的站点管理流程其实就是插入元素（文本、图像戒者 AP 元素等）和修改已插入的元素两个过程的交替迚行。
1.2.1 界面布局
在Windows 系统中的集成Dreamweaver CS6 工作区预设布局不Dreamweaver CS5 的 布局种类相比，除了经典、编码器、编码人员( 高级)、设计器、设计人员（紧凑） 和双重屏幕几种布局模式外，还新增了Business Catalyst、流体布局、移劢应用程序 这三种布局模式。
4. 更新的实时视图
使用更新的“实时视图”功能在収布前测试页面。
5. 更新的多屏幕预览面板
利用更新的“多屏幕预览”面板检查智能手机、平板电脑和台式机所呈现的页面效果
6. CSS 过滤效果
使用新增的“CSS 过渡效果”面板，能使页面元素的发化平滑运劢起来。
7. 多 CSS 类选区
现在可以将多个 CSS 类应用于单个元素。
11. 对 FTP 传递的改迚
Dreamweaver 使用多线程传输选定文件
12. 站点管理面板改迚
该选顷卡主要用来添加不网站后台数据库相关的劢态交互元素，例如记录集、重复区域以及 插入表单和更新记录表单等。
5. “ Spry”选顷卡
1.Dreamweaver CS6 基础知识解析
A ：呈现屏幕媒体类型，显示页面在计算机屏幕上的显示方式。 B ：呈现打印媒体类型，显示页面在打印纸张上的显示方式。 C ：呈现手持型媒体类型，显示页面在手持设备（如手机或 BlackBerry 设备）上的显示方式。
D ：呈现投影媒体类型，显示页面在投影设备上的显示方式。
E ：呈现 TTY 媒体类型，显示页面在电传打字机上的显示方式。 F ：呈现 TV 媒体类型，显示页面在电视屏幕上的显示方式。 G：切换 CSS 样式的显示，用于启用或禁用 CSS 样式。此按钮可独立于其它媒体按钮之外工作。
jQuery Mobile 是也是一个JavaScript 库，是jQuery 在手机上和平板设备上的版本，具有页面、列表视 图、布局网格、可折叠区块、文本输入、密码输入 、滑盖、反转切换开关等元素，大大提高了移动设 备应用程序的开发效率。
H ：设计时样式表，可用于指定设计时样式表。
5. 编码工具栏
编码工具栏垂直显示在文档窗口的左侧，只出现在代码视图中。在使用编码工具栏时，不能 将其取消停靠或移动，但是可以将它隐藏起来。
6. 状态栏
状态栏位于窗口的底部，用于提供与当前文档有关的信息
A ：标签选择器 B ：选取工具 C ：手形工具
D ：缩放工具
E ：设置缩放比率 F ：手机屏幕、平板电脑屏幕和显示器屏幕切换 G ：窗口大小弹出菜单（在“ 代码” 视图中不可用）
网页设计与制作Dreamweaver CS6标准教-ppt课件-02
编辑站点可以重新设置站点的一些属性，操作 步骤如下。 选择菜单【站点】|【管理站点】，打开【管 理站点】对话框，选择要编辑的站点名称，如 webtest，单击编辑按钮图标 。 打开【站点设置对象webtest】对话框。经 过对各种设置修改后，单击【保存】按钮，返 回【管理站点】对话框。
Dreamweaver CS6提供了多文档的编辑界面，将多 个文档集中到一个窗口中，用户可以单击文档编辑窗 口上方选项卡的文件名切换到相应的文档，还可以按 住鼠标左键拖动选项卡改变文档的顺序。
站点是存放一个网站所有文件的场所，由若干文 件和文件夹组成。用户在开发网站前必须先建立 站点，便于组织和管理网站文件。
在Dreamweaver中删除站点，只是删除了 Dreamweaver同本地站点之间的关系。本地 站点中的文件夹和文件，仍然保存在硬盘原来 的位置上，没有被删除，也没有任何改变。 删除站点的操作步骤如下。 选择菜单【站点】|【管理站点】，打开【管 理站点】对话框，选择要删除的站点名称，单 击【删除】按钮。 在打开的【Dreamweaver】对话框中单击 【是】按钮，选中的站点就被删除，
建立站点以后，可以对站点进行打开、编辑、 复制和删除等各种操作。
2.3.1打开站点 2.3.2编辑站点 2.3.3复制站点 2.3.4删除站点
Dreamweaver允许建立多个站点，并可以通 过切换打开需要编辑的站点。打开站点的操作 步骤如下。 选择菜单【窗口】|【文件】或按<F8>键打 开【文件】面板，单击左边的下拉框，在下拉 列表中选择要打开的站点。 打开站点后，在【本地文件】下显示该站点 内的所有文件和文件夹。
边做边学——Dreamweaver CS6网页设计案例教程教学教案
2．设置文本属性
3．输入连续的空格
4．设置是否显示不可见元素
5．设置页边距
6．设置网页的标题
7．设置网页的默认格式
2.1.5【实战演练】——佳人SPA养生馆网页
2.2休闲旅游网页
2.2.1【案例分析】
2.2.2【设计理念】
2.2.3【操作步骤】
1．添加字体
2．改变文字外观
2.2.4【相关工具】
5.3综合演练——茶文化网页
5.3.1【案例分析】
5.3.2【设计理念】
5.3.3【知识要点】
5.4综合演练——火锅餐厅网页
5.4.1【案例分析】
5.4.2【设计理念】
5.4.3【知识要点】
小结
1.熟练掌握表格的插入及表格属性的设置方法和技巧。
2.熟练掌握表格嵌套布局。
作业
第6讲
课时内容
使用框架
授课时间
3.3.3【知识要点】
3.4综合演练——房源网页
3.4.1【案例分析】
3.4.2【设计理念】
3.4.3【知识要点】
小结
1.熟练掌握图像的格式与插入方法和使用技巧。
2.掌握Flash动画的插入和属性的设置。
作业
第4讲
课时内容
超链接
授课时间
180分钟
课时
4
教学目标
了解超链接的概念与路径知识
掌握文本超链接的创建方法和技巧。
《边做边学——Dreamweaver CS6网页设计案例教程》
教学教案
第1讲
课时内容
初识Dreamweaver CS6
授课时间
90分钟
课时
2
教学目标
掌握工作界面的操作。
DreamweaverCS6网页设计教学教案
使用“项目列表”按钮，设置项目列表效果云盘/Ch02/使用“页面属性”命令，设置页面边距和标题；使用“首选参数”命令，设置允许多个云盘/Ch02/使用“图像”按钮，插入图像云盘/Ch03/使用“云盘/Ch03/使用“命名锚记”按钮，插入锚点制作文档底部移动到顶部的效果。
云盘/Ch04/使用“电子邮件链接”按钮，制作电子邮件链接效果；使用“属性”面板，为文字制作云盘/Ch04/使用“页面属性云盘/Ch05/使用“导入表格式数据”命令，导入外部表格数据；使用“属性”面板，改变表格的高云盘/Ch05/使用云盘/Ch06/使用“对齐上缘”命令，制作网页的结构图效果云盘/Ch06/使用“绘制云盘/Ch07/使用“云盘/Ch07/使用“项目列表”按钮，创建无序列表云盘/Ch08/使用“云盘/Ch08/使用“另存模板”命令，将页面存为模板；使用“可编辑区域”按钮，添加可编辑区。
云盘/Ch09/使用“库”面板，添加库项目；使用库中注册的项目，制作网页文档。
云盘/Ch09/使用“文本字段”按钮，制作用户名、手机、密码和验证码文本框；使用“云盘/Ch10/使用“文本字段”按钮，插入文本字段；使用“图像域”按钮，插入图像域；使用“选云盘/Ch10/使用“弹出信息”行为命令，制作弹出信息效果；使用“状态栏文本”行为命令，制作云盘/Ch11/使用“交换图像”命令，制作鼠标经过图像发生变化效果。
云盘/Ch11/使用“插入标签”命令，制作浮动框架效果。
云盘/Ch12/使用“云盘/Ch13/使用“云盘/Ch13/使用“页面属性”命令，设置页面字体、大小颜色和页面边距；使用“属性”面板，设云盘/Ch14/使用“页面属性”命令，设置页面字体、大小颜色和页面边距；使用“图像”按钮，插云盘/Ch14/使用“页面属性”命令，设置页面字体、大小颜色和页面边距；使用“属性”面板，设云盘/Ch15/使用“页面属性”命令，改变页面字体、大小、颜色、背景颜色和页边距效果；使用“云盘/Ch15/使用“图像”按钮，添加网页标志和广告图；使用“云盘/Ch16/使用“鼠标经过图像”按钮，制作导航效果；使用“属性”面板，设置单元格高度和对云盘/Ch16/使用“页面属性”面板，更改页面属性；使用“云盘/Ch17/使用“页面属性”命令，设置页面字体、大小、颜色和页面边距；使用“属性”面板，云盘/Ch17/使用“表格”按钮，布局网页；使用“页面属性”命令，控制页面的整体字体、大小和云盘/Ch17/使用“页面属性”命令，设置网页背景颜色及边距；使用输入代码方式设置图片与文字云盘/Ch17/。
1.Dreamweaver-CS6-基础知识解析
5. 编码工具栏
编码工具栏垂直显示在文档窗口的左侧，只消逝在代码视图中。 在使用编码工具栏时，不能将其取消停靠或移动，但是可以将 它隐蔽起来。
6. 状态栏 状态栏位于窗口的底部，用于供给与当前文档有关的信息
A ：标签选择器 B ：选取工具 C ：手形工具 D ：缩放工具 E ：设置缩放比率 F ：手机屏幕、平板电脑屏幕和显示器屏幕切换 G ：窗口大小弹出菜单〔在“ 代码” 视图中不行用〕 H ：文档大小和下载时间 I ：编码指示器
8. “ 文本”选项卡
“文本”选项卡用于插入各种文本格 式和列表格式的标签。
9. “ 保藏夹”选项卡
1.2.4 属性检查器 属性检查器用于检查和编辑当前选定页面元素的最常用属性，随着
选定元素的不同会有所变化。它在设计视图和代码视图中都能显 示。
1.2.5 使用治理面板和面板组 Dreamweaver 通过一套面板和面板组系统来轻松地处理不同的简洁
界面。
1. 开放或折叠面板 单击面板右上角的“折叠为图标”
或者“开放面板”图标可以轻松 开放或折叠面板，折叠为图 标后的显示方式有两种：只 显示图标和显示图标以及相 应的文字。
2. 拖动面板或者面板组 在众多的面板组〔又称为标签组
，下同〕集合的局部，假设 希望将其中一个面板或者面 板组拖出来，用户可以直接 将鼠标指针放在需要拖出的 面板名称上或者面板组名称 的后面，按下鼠标左键不放 拖动鼠标就可以将其拖出。
中文版DreamweaverCS6网页设计教程IT168文库
第1章Dreamweaver CS6简介Dreamweaver CS6是一款功能强大的可视化的网页编辑与管理软件。
利用它，不仅可以轻松地创建跨平台和跨浏览器的页面，也可以直接创建具有动态效果的网页而不用自己编写源代码。
Dreamweaver CS6 最主要的优势在于能够进行多任务工作，并且在操作方法、界面风格方面更加人性化。
用户可以根据自己的喜好和工作方式，重新排列面板和面板组，自定义工作区。
本章主要内容●Dreamweaver CS6的新增功能。
●Dreamweaver CS6的安装、删除和启动。
●Dreamweaver CS6的工作界面。
●Dreamweaver CS6的一般操作。
本章重点●Dreamweaver CS6常用面板的使用方法。
●Dreamweaver CS6的文件操作。
1.1 Dreamweaver CS6概述Dreamweaver CS6 是世界顶级厂商Adobe推出的一套拥有可视化编辑界面，用于制作并编辑网站和移动的软件。
在业界通常将Dreamweaver、Flash、Fireworks称为“网页三剑客”。
由于它支持代码、拆分、设计、实时视图等多种方式来创作、编写和修改网页，因此对于初级人员，无须编写任何代码就能快速创建Web页面。
其成熟的代码编辑工具更适用于Web开发高级人员的创作。
CS6新版本使用了版面创建页面，在发布前可使用多预览审阅设计,大大提高了用户的工作效率，而改善的FTP性能可更高效地传输大型文件。
“实时视图”和“多屏幕预览”面板可呈现HTML5 代码，用户能更方便地检查自己的工作。
1.2 Dreamweaver CS6的新增功能相对于以前的版本，Dreamweaver CS6的功能主要在以下方面进行了增强。
1. 可响应的自适应网格版面使用响应迅速的CSS 版面，可以创建跨平台和跨的兼容。
利用简洁、业界标准的代码可为各种不同设备和计算机开发项目，提高工作效率。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
13.3.1
了解DSN
DSN（Data Source Name，数据源名称），表 示将应用程序和某个数据库建立连接的信息集合。
13.3.2
定义系统DSN
数据库建立好以后，需要设定系统的DSN（数据 源名称）来确定数据库所在的位置以及数据库相 关的属性。
13.3.3
建立系统DSN连接
数据源建立以后，接下来要定义这个网站使用的 数据库连接。只有如此，这个网站才能通过数据 库连接来存取数据库里的信息。
入
留言系统
发布留言页面
留言列表页面
显示留言页面
13.6.1
创建数据库
在制作具体网站功能页面前，首先做一个最重要 的工作，就是创建数据库表，用来存放留言信息 所用。
13.6.2
HTML文本是由HTML标签组成的描述性文本， HTML标签可以说明文字、图形、动画、声音、表 格、链接等。HTML的结构包括头部（Head）、主 体（Body）两大部分，其中头部描述浏览器所需的 信息，而主体则包含所要说明的具体内容。
HTML是HyperText Markup Language的缩写， 即超文本标记语言，这是创建网页的脚本语言，它 提供了精简而有力的文件定义，可以设计出多姿多 彩的超媒体文件，通过HTTP（Hyper Text Transfer Protocol）通信协议，使得HTML文件可 以在全球互联网（World Wide Web）上进行跨平 台的文件交换。
13.5.5
转到相关页面
可以建立一个链接打开另一个页面而不是它的子 页面，并且传递信息到该页面，这种页面与页面 之间进行参数传递的两个页面，称为相关页。
13.5.6
用户身份验证
为了更能有效地管理共享资源的用户，需要规范 化访问共享资源的行为。
13.6
实战演练——创建留言系统
留言系统是网站与用户交流沟通的方式之一。当 客户浏览网页时，如果有什么需要，可以在留言 系统中给站点管理员留言。
13.4
编辑数据表记录
动态网页最主要的就是结合后台数据库自动更新 Web页面离开了数据库也就谈不上动态页面了。
13.4.1
了解记录集
将数据库用作动态网页的数据源时，必须首先创 建一个记录集。记录集在数据库和动态应用程序 页面之间起一种桥梁作用。
13.4.2
创建记录集
应用Dreamweaver CS6的绑定功能在 Dreamweaver CS6中定义一个记录集，以实现 网页读取数据的功能，只需要打开【绑定】面板， 在其中绑定指定的数据表，新增所需的记录集即 可。
13.2.5
用标签检查器编辑标签
除了使用标签选择器编辑标签外，还可以使用标 签检查器在属性表中编辑标签，方法非常简单， 选择菜单中的【窗口】|【标签检查器】命令， 打开【标签检查器】面板，如图13.19所示。
13.3
建立数据库连接
任何内容的添加、删除、修改和检索都是建立在 连接基础上进行的，可以想像连接的重要性了。
13.4.5
删除记录
利用Dreamweaver的【删除记录】服务器行为， 可以在页面中实现删除记录的操作。删除记录的 页面执行两种不同的操作，首先显示已存在的数 据，用户可以选择将要被删除的数据；其次从数 据库中删除此记录以反映用户选择的记录被删除 的结果。
13.5
增加服务器行为
如果想显示从数据库中取得的多条或者所有记录， 则必须添加一条服务器行为，这样就会按要求连 续地显示多条或者所有的记录。
13.2.1
使用代码提示
通过代码提示，可以在代码视图中插入代码。
13.2.2
使用代码片段
使用代码片断，可以保存内容以便快速重复使用。
13.2.3
使用标签选择器插入标签
使用标签选择器可以将Dreamweaver标签库中 的任何标签插入页面中。
13.2.4
使用标签编辑器编辑标签
通过标签编辑器，可以使用对话框指定或编辑某 一标签的属性。
13.5.1
插入重复区域
【重复区域】服务器行为允许在页面中显示记录 集中的多条记录。任何动态数据都可以转变成重 复区域。
13.5.2
插入显示区域
选择菜单中的【窗口】|【服务器行为】命令， 打开【服务器行为】面板，在面板中单击+按钮， 在弹出的菜单中选择【显示区域】选项，在弹出 的子菜单中根据需要选择，如图13.40所示。
13.1.2 HTML的基本语法
超文本文档分为头部和主体两部分，在文档头部里， 对这个文档进行了一些必要的定义，文档主体中才 是显示的各种文档信息。
13.2
在Dreamweaver CS6中编写代码
对于客户端编码，可以在Dreamweaver中处理 多种文件类型，包括HTML、XML、层叠样式表 （CSS）、JavaScript、VBScript、无线标记语言 （WML）、扩展数据标记语言（EDML）、 Dreamweaver模板（.dwt）和文本等。
教学内容：动态网页就是根据访问者的请求， 由服务器生成的网页，访问者在发出请求后， 在服务器上获得生成的动态结果，并以网页形 式显示在浏览器中。
• • • • • •
教学重点 了解HTML基础 熟悉在Dreamweaver CS6中编写代码 掌握数据库连接的创建 掌握编辑数据表记录 掌握服务器行为的使用 掌握留言系统的创建
13.4.3
插入记录
一般来说，要通过ASP页面向数据库中添加记录， 需要提供用户输入数据的页面，利用 Dreamweaver CS6的【插入记录】服务器行为， 就可以向数据库中添加记录。
13.4.4
更新记录
选择菜单中的【窗口】|【服务器行为】命令， 打开【服务器行为】面板，在面板中单击+按钮， 在弹出菜单中选择【更新记录】选项，打开【更 新记录】对话框，如图13.36所示。
13.5.3
记录集分页
Dreamweaver CS6提供的【记录集分页】服务 器行为，实际上是一组将当前页面和目标页面的 记录集信息整理成URL地址参数的程序段。
13.5.4
转到详细页面
应用程序可以将信息或参数从一个页面传递到另 一个页面。要想让一个页面告诉另一个页面显示 什么记录或想把一个页面的信息传递到另一个页 面时，就要用到适当的服务器行为。