Dreamweaver框架的组成
DreamweaverCS6 HTML CSS DIV JavaScript网站开发框架与浮动框架
第七章框架与浮动框架课堂案例:企业邮箱网页地制作7.1网站地后台管理页一般是由框架结构组成,本章通过学习框架地网页组织形式,制作企业邮箱地页面。
准备知识:框架与框架集7.2•创建框架7.2.2•删除框架与增加框架7.2.4•框架与框架集介绍7.2.1•保存框架7.2.3•在框架使用超链接7.2.5框架与框架集介绍7.2.1框架是网页常用地布局方式与网页间地组织形式,经常使用在网站地后台,邮箱,论坛等结构为一个浏览器窗口划分为若干区域并且每个区域显示不同地网页文件地网页组成。
框架是网页经常使用地页面设计方式,其作用就是把网页在一个浏览器窗口下分割成几个不同地区域,实现在一个浏览器窗口显示多个HTML页面。
使用框架可以非常方便地完成导航工作,让网站地结构更加清晰,而且各个框架之间决不存在干扰问题。
利用框架最大地特点就是使网站地风格一致。
一个框架是由框架与框架集构成,框架是浏览器窗口地一个区域,它可以显示与浏览器窗口地其余部分所显示内容无关地网页文件;框架集也是一个网页文件,它将一个窗口通过行与列地方式分割成多个框架,框架地多少根据具体有多少网页来决定,每个框架要显示地就是不同地网页文件。
框架地HTML标签为<frame></frame>,框架集地HTML标签为<frameset></frameset>。
1创建框架打开Dreamweaver工具,创建一个新地站点名称为frame）,新建一个网页文件,暂时不保存。
在Dreamweaver地CS6版本,单击菜单栏地插入 HTML 框架然后选择菜单地具体框架结构。
2修改框架显示大小与框架属性方法一:修改框架在浏览器显示大小,将鼠标放到框架边框上,当出现双箭头光标时拖拽框架边框,可以改变框架地显示大小。
方法二:单击代码视图,在代码修改rows="80,*"或cols="80,*"地值,如修改为rows="169,*"或cols="257,*"。
Dreamweaver考试试题及参考答案(三)
Dｒｅamwｅａvｅr MX考试试题单选题1．用下列的（）快捷键可以打开“文件”菜单。
A．Ctrｌ＋F B.Ctrl+LﻩＣ．Alt+F D.+Alt+L2.用下列的( ）快捷键可以调出Dreａｍweaver的查找与替换对话框。
Ａ．Cｔrl+F B.Ｃtrl+L C.Alｔ+ＦＤ．Aｌt+L3．在DreamweａveｒMＸ中的( ）菜单里可以重新设置工作区。
A．文件 B.编辑 C.视图 D.格式４．用下列的（）快捷键可以新建文件。
Ａ．Ctrl+Ｎ B.Ctrl+M C.Ctrl+PＤ.Ctrl+Ｃ５.本地站点的所有文件和文件夹必须使用( ），否则在上传到因特网上时可能导郅浏览不正常。
A．小写字母 B.大写字母 C.数字D．汉字６．在Dｒｅamweaveｒ中文本的输入可以手工输入,也可以将别的文档中的文本复制到Ｄrｅａｍweaｖer 编辑的网页中，还可以（）。
A．导入ｈｔmｌ、txt文档 B.ｈｔml、ｔｘｔ文档C．查找 D.修改7.在复制带有格式的文本时,可以先将内容粘到（)，再将其中没有格式的文本复制到剪贴板上,最后再粘贴到Ｄrｅaｍweaｅr编辑窗口中。
Ａ.文件夹B．记事本 C.Word文档 D.Eｘcel文档8.重做的快捷键是( ）。
A．Cｔｒｌ＋ＹB．Ｃｔrｌ＋N C.Cｔrl+Z D.Ctｒｌ+O９．选中要进行预格式化处理的文件,然后在（)面板中选择该段文本为“预先格式化”。
A．代码Ｂ．设计 C.属性Ｄ.应用程序10．分行显示文字应用(）。
A.EｎtｅrB.Shift+ＥｎterC.Ｃtrl＋EnterＤ.Cｔrl+Alt11.常用的网页图像格式有（)和( )。
A.gif,tiffB.tｉff，jpg Ｃ.ｇｉｆ,jpｇＤ．tiff．png12.ＵＲＬ是（)的简写,中文译作（）。
A．ＵniforｍRｅａｌＬocaｔoｒ,全球定位Ｂ．ＵｎiｎＲeｓource Locａtor,全球资源定位C.Uniform Real Loｃａtor,全球资源定位Ｄ．Uniform Ｒｅsource Locator，全球资源定位13．常用的网页动画格式有（）。
Dreamweaver CS3 详解
Dreamweaver CS3 简介Dreamweaver CS3是一款功能强大的可视化的网页编辑与管理软件。
利用它，不仅可以轻松地创建跨平台和跨浏览器的页面，也可以直接创建具有动态效果的网页而不用自己编写一行源代码。
Dreamweaver CS3 最主要的优势在于能够进行多任务工作，并且在操作方法、界面风格方面更加人性化。
用户可以根据自己的喜好和工作方式，重新排列面板和面板组，自定义工作区。
1 Dreamweaver CS3概述Dreamweaver CS3是由Adobe公司在并购Macromedia之后推出的最新版本，它是一款专业的Web站点开发软件，可用于Web站点、Web页和Web应用程序的设计、编码和开发工作。
在业界通常将Dreamweaver、Flash、Fireworks称为网页三剑客。
将各种网页制作的相关工具紧密联系起来是Dreamweaver系列的一大亮点，同时良好的插件体系，使Dreamweaver CS3可通过第三方插件进行补充。
另外，Dreamweaver CS3还为开发人员提供了动态语言支持与丰富的模板。
另外值得称道的是，Dreamweaver CS3不仅提供了强大的网页编辑功能，而且提供了完善的站点管理机制，可以说，它是一个集网页创作和站点管理两大利器于一身的超重量级的创作工具。
Dreamweaver CS3在功能强大与易用性之间具有很好的平衡，使用Dreamweaver CS3可以有效地提高Web开发的工作效率。
2 Dreamweaver CS3的新增功能相对于以前的版本Dreamweaver CS3的功能主要在以下方面进行了增强：1. Ajax 的Spry 框架通过Adobe Dreamweaver CS3，可以使用Ajax 的Spry框架进行动态用户界面的可视化设计、开发和部署。
Ajax 的Spry 框架是一个面向Web 设计人员的JavaScript 库，用于构建向用户提供更丰富体验的网页。
dreamweaver教程
目录第一章：认识Dreamweaver MX 2004第二章：创建站点第三章：设置首页第四章：插入文本第五章：插入图象第六章：插入多媒体]第七章：建立网页链接第八章：表格第九章：层第十章：框架第十一章：表单第十二章：使用CSS第十三章：行为第十四章：资源第十五章：模板第一章：认识DreamWeaver一、认识DreamWeaver⑴标题栏⑵菜单栏⑶工具栏查看/工具栏/插入、文档、标准或插入工具栏/插入⑷网页的编辑窗口标记⑸属性面板⑹浮动控制面板（组）把鼠标放在有麻点的粘黑三角附近可移到任何位置，同时，采用同样的方式也可以拖回来。
二、更件要求：PⅢ600MHz处理器Window98以上至少128M内存、建议采用256M内存至少275Mb的可用磁盘空间显示器：1024×768百万种颜色显示器第二章：创建站点一、网站分析企划（1）要做什么类型网站，例商业的，个人的个人：在设计上不拘束，发挥自己的想象力商业：考虑公司的形象和网站的统一性，避免太过浮躁，表现太多个人想法。
（2）网站分析企业网站的名称：性质：未来网站浏览者特征：主要应用群体网站的风格：自已的特色网站分类：各个大模块收集素材：文本、图象、动画、视频二、站点（1）创建站点菜单站点/管理站点/否/选择无/完成（2）编辑站点站点/管理站点/编辑（与新建站点一样）◆复制：跟复制文件一样◆删除：只要选中要删除的站点◆导出：此站点（选中）导出一个扩展为.ste文件做备份用。
各计算机移动站点，与其它用户共享。
（3）导入：将导出的站点，重新添加到站点列表中，经供使用。
三、创建站点内容建立：右侧的浮动面板组/文件/文件/右键击本地根目录文件夹/可新建网页和文件夹删除：选中删除项目/按下键盘中的DEL键，弹出对话框，确定。
四、“文件浮动面板”右侧的浮动面板，相当于快捷键，熟练掌握。
第三章设置首页一、首页：每个网站都有首页，代表网站的风格与特色，网站上其它网页必须通过首页散发出去，可见道的重要性。
dreamweaver 系统组成的结构
dreamweaver 系统组成的结构Dreamweaver系统组成的结构Dreamweaver是一款功能强大的网页设计和开发工具，它由多个组件组成，每个组件都担负着不同的任务。
以下是Dreamweaver 系统的组成结构：一、代码编辑器Dreamweaver的代码编辑器是其核心组件之一，它提供了强大的代码编辑功能，支持多种编程语言，如HTML、CSS、JavaScript 等。
代码编辑器具有语法高亮、代码提示、代码折叠等功能，可以帮助用户编写出规范、有效的代码。
二、视图面板视图面板是Dreamweaver中用于预览和编辑网页的界面。
它包括标签面板、属性面板、样式面板等。
标签面板用于显示网页的结构，用户可以通过拖拽标签来快速生成网页。
属性面板则用于设置标签的属性，如颜色、字体、大小等。
样式面板用于编辑和管理网页的样式表。
三、文件管理器文件管理器是Dreamweaver中用于管理网站文件的工具。
通过文件管理器，用户可以方便地创建、删除、移动和重命名文件和文件夹。
文件管理器还支持文件的上传和下载，可以实现与服务器的文件同步。
四、图像编辑器图像编辑器是Dreamweaver中用于编辑和优化图像的工具。
它提供了丰富的图像编辑功能，如剪裁、调整大小、旋转、添加滤镜等。
图像编辑器还支持图像的压缩和优化，可以帮助用户减小网页的加载时间。
五、交互式元素交互式元素是Dreamweaver中用于添加交互效果的工具。
它包括按钮、链接、表单等元素，用户可以通过拖拽这些元素来创建交互式的网页。
交互式元素还支持事件触发和脚本编写，用户可以通过编写JavaScript代码来实现更复杂的交互效果。
六、动态网页开发工具Dreamweaver还提供了一系列用于开发动态网页的工具，如服务器连接工具、数据库连接工具等。
这些工具可以帮助用户与服务器进行交互，实现动态网页的开发和调试。
七、预览和调试工具Dreamweaver提供了预览和调试工具，用于在开发过程中预览和调试网页。
用Dreamweaver建立框架页面
实验8 用Dreamweaver建立框架页面实验目的：通过实验，掌握如何如何创建和应用框架页面，了解框架的基本分布结构和各个框架页面之间的相互联系。
实验步骤：1. 启动Dreamweaver程序，选择菜单“文件”“新建”命令，打开“新建文档”对话框。
在对话框中“常规”标签下选择“类别”列表中的“框架集”选项，然后再右边的“框架集”列表中选择“上方固定”选项，如图8-1所示。
单击“创建”按钮创建框架网页。
2. 选择菜单“窗口”“框架”命令，打开框架控制面板。
3. 用鼠标单击框架控制面板中的下部分，选中mainFrame框架。
如图8-2所示：图8-1 套用框架图11-2 选择框架集的子框架4. 将鼠标放在选中的边框上，使鼠标变成双向箭头，然后拖动鼠标将该框架分成左右两个子框架。
如图8-3所示。
图8-3 把主框架切分为子框架5. 在框架编辑窗口中，单击顶部框架，选择菜单“文件”→“保存框架”命令，保存框架为top.htm页面。
6. 将光标停放到下部分框架的左边框家中，选择菜单“文件”→“保存框架”命令，保存框架为left.htm页面。
7. 按同样的方法，将右边的框架保存为right.htm页面。
8. 单击框架面板上最外层的边框，或单击页面编辑窗口中的最外层边框，使外框出现虚线。
如图8-4所示：图8-4选中整个框架说明鼠标单击所选中的框架，所选中的框架就是当前正在编辑的页面.9. 选择菜单“文件”—>“保存全部”命令，保存所有框架和框架集，框架集文件名称为index.htm.如图8-5所示.10. 单击框架面板上的topFrame框架，选中top.htm网页.11. 打开属性面板，在属性面板上的“滚动”下拉菜单中选择“否”，图8-5 保存框架集然后勾选旁边的“不能调整大小”复选框；在“边界宽度”和“边界高度”的文本框中都输入0，参数设置如图8-6所示.图8-6 top框架的属性设置说明框架属性面板上的“滚动”下拉菜单中有“是”.“否”.“自动”.和“默认”四项，其中选择“是”表示允许页面左右.上下出现滚动条；选择“自动”.“默认”表示根据网页内容，需要时自动显示滚动条；选择“否”表示不允许出现滚动条.12. 单击top框架页面，在属性面板中单击“页面属性”按钮。
大学《网页制作与设计》复习题
《网页制作与设计》复习题一、单选题1．为了标识一个HTML文件应该使用的HTML标记是（）。
A.<p> </p>B.<boby> </body>C.<html></html> D.<table> </table>2．以下国际域名中属于教育机构的是（）。
A．com B．net C． edu D．gov 3．Dreamweaver属于（）的网页制作工具。
A．标记型B．所见即所得C．编程型D．图像处理型4．在URL中，最为常用的协议是（）。
A．File B．Http C．FTP D．Telnet5．表格标记中表示行的标记是（）。
A．<table></table> B．<th></th> C．<tr></tr>D．<td></td>6．以下标记符中，没有对应的结束标记的是（）。
A <body>B <br>C <html>D <title>7.下列哪一项是在新窗口中打开网页文档（）。
A．_self B．_blank C．_top D．_parent8.关于超链接，（）的说法是正确的。
A．不同网页上的图片或文本可以链接到同一网页或网站B．不同网页上的图片或文本只能链接到同一网页或网站C．同一网页上被选定的一个图片或一处文本可以同时链接到几个不同网站D．同一网页上图片或文本不能链接到同一书签9.通过哪个属性可以为图片添加边框线。
（）A. htmlB. aspC. borderD. img10.在网页中最常用的单位是（）。
A. inB. cmC. pxD. pc11.HTML是一种 ( )。
A．程序设计语言B．执行语言C．编译语言D．页面描述语言12.HTML中表示表格标题的标记为( )。
Dreamweaver第12章 APDiv
12.1.2 AP层的属性
• 利用“属性检查器”对AP层属性进行设置，可以调整创建好的AP层， 达到预期的网页布局效果。AP层的属性包括ID、位置、大小、Z轴、 可见性、背景、类、溢出、剪辑等基本属性，如图12.9所示。
12.2 AP层的基本操作
• 上一节学习了AP层的创建及其属性，这一节我们为大家介绍一下AP 层的基本操作，包括AP层的激活与选择，插入内容，调整AP层的位 置、大小、层叠顺序、可见性、背景、对齐方式等。
12.3.1 AP层常见布局形式
• 首先来了解几种常见的AP层布局形式，主要包括多行单列、单行多 列、多行多列。 • 1．多行单列 • 2．单行多列 • 3、多行多列
12.3.2 AP层综合布局实例
• 在了解常见AP层布局形式之后，我们结合贵州茅台酒股份有限公司 的主页面来学习如何使用AP层为网页页面搭建综合布局框架。 • 如图12.41所示，页面有一个整体背景，顶部为公司LOGO、Banner及 网站导航放置区域；中间部分为公司主要内容放置区域，分为左、 中、右三列；页脚为公司版权信息及导航放置区域。
12.2.6 改变AP层的可见性
• • • AP层可见性的改变也可通过 “AP元素”面板与“属性检查器”来实现。 （1）单击“窗口”|“AP元素”打开“AP元素”面板，如图12.25所示。 （2）用鼠标单击要更改AP层名称前面的眼睛图标即可改变AP层的可见性。 闭上的眼睛图标表示AP层被隐藏，处于不可见状态；睁开的眼睛图标表示AP 层被显示，处于可见状态；没有眼睛图标表示该AP层继承其父AP层（即被嵌 套AP层）的可见性属性。 • 注意：若想统一更改所有AP层的可见性，可用鼠标单击列顶端的眼睛图标。 • （3）在“属性检查器”中更改。选中要设置可见性的AP层，在“属性检查 器”中“可见性”下拉列表框中选择相应可见性选项即可，如图12.26所示。
Dreamweaver网页设计第一章
1.4 层的使用
1.4.1 层的基本概念 图层是一个独立于网页的区块，它允许被放置在网页中的任何位 置。图层中可以放置文本、图像、表单、对象插件，甚至可以放 入其他层。 层的主要特性是可以在网页中上下浮动，即可以在网页中改变层 的位置。另外，层还可以重叠，做出网页中的文档或图片重叠的 效果；可以被显示或隐藏，做出层内容交替显示的效果。
1.4 层的使用
1.4.2 绘制层并设置层属性
绘制层：【插入】 →【布局对象】 →【AP Div】，然后在需要的地方 用鼠标绘制出层。 层属性设置同样可以通过属性面板进行修改，其中“可见性”可以设 置层是否隐藏，合理命名层ID可以有效管理并提高效率。
1.4 层的使用
1.4.3 层的嵌套 层的嵌套就是指在一个层中嵌入其他的层，新嵌入的层称为 子层，原来的层称为父层。子层与父层有如下特点：
课程设置
模块一：静态网页（HTML）的设计与制作
模块二：动态网页（ASP）与数据库（access2003） 模块三：综合应用实例
第一章
走进Dreamweaver
1.1 Dreamweaver的基本操作 1.2 表格布局 1.3 图片应用与超链接 1.4 层的使用
1.5 框架技术
1.1 Dreamweaver的基本操作
• • • • 子层与父层可以重叠，也可以不重叠。 子层大小可超过父层。 子层的可见性与父层保持一致。 子层与父层的相对位置保持一致。
创建嵌套层的方法如下： 先创建父层，将光标放在父层中，然后，在Dreamweaver CS4主窗口中，单击 菜单【插入】→【布局对象】→【AP Div】，即可创建嵌套层，新插入的层为 子层。 利用“层”面板创建嵌套层，在“层”面板中选中作为子层的层，按住【 Shift】键，将选中的层拖动到要作为父层的层上，释放鼠标即可创建嵌套层 ，这时子层与父层以连接线相连，表明其从属关系。单击父层左边的号可以展 开其所有子层，单击号可以折叠其子层。
Dreamweaver简介
过的文档。单击“打开”按钮 ，可以调出“打开”对话框，利用该对话框可以选择要编辑的网页文档，再单击
“打开”按钮，即可打开选定的文档。
2．“从模板创建”栏和“Dreamweaver 帮助”栏 （1）“从模板创建”栏：单击其中的图标按钮，可调出不同的“新建文档”对话框，利用该对话框可以新建 一个相应的文档。在文档底部的“扩展”栏中有一个“Dreamweaver Exchange”按钮，单击该按钮后，可以链接 到 Dreamweaver Exchange 网站。 （2）“Dreamweaver 帮助”栏内有“快速入门”、“新增功能”和“资源”三个按钮。分别单击这三个按钮， 0.3.3 文档窗口 可以进入 Adobe 的“Dreamweaver CS3”帮助网站中相应的网页。 文档窗口用来显示和编辑当前的文档页面。当文档窗口处于还原状态时，其标题栏内显示网页的标题、网页
图 0-3-3 “编码器”风格的 Dreamweaver CS3 的工作区 （2）调整工作区布局（例如，打开或关闭一些面板、工具栏，调整面板的位置等）后，单击“窗口”→“工 作区布局”→“保存当前”命令，可弹出“保存工作区布局”对话框，在“名称”文本框内输入名称（例如，陈 芳麟），如图 0-3-4 所示。再单击“确定”按钮，即可将当前工作区布局保存。
（2）单击“文档”→“另存为”命令，弹出“另存为”对话框。在该对话框中，用户可以将当前的文档以其
他名字保存。 （3）单击“文档”→“保存全部”命令，可将当前正在编辑的所有文档以原名保存。
（4）单击“文档”→“关闭”命令，可关闭打开的当前文档。如果当前文档在修改后没有存盘，则会弹出一
“查看”→“刷新设计视图”命令，可刷新设计视图状态下显示的网页。按【F12】键，可以用浏览器来浏览网页。
DreamWeaver第四章-层和框架
2021/8/2
9
层和表格的转换
❖层可以随便移动 ❖层转换成表格
“修改/转换/层到表格”
2021/8/2
10
层和表格的转换
❖“修改/转换/表格到层”
2021/8/2
11
练习
❖当将鼠标指针划过一个植物的图像时， 显示一个层，在该层中显示该植物的生 长季节和地区、需要多少阳光、可以长 到多大等详细信息。
要在一个框架中使用链接以打开另一框架中 的文档，用户必须设置连接目标
Target
➢_blank, _parent, _self, _top，……
2021/8/2
27
•_blank 在新的浏览器窗口中打开链接的文档，同时保持当 前窗口不变。
•_parent 在显示链接的框架的父框架集中打开链接的文档， 同时替换整个框架集。
•_self 在当前框架中打开链接，同时替换该框架中的内容。 •top 在当前浏览器窗口中打开链接的文档，同时替换所有框 架。
2021/8/2
28
❖ 替换框架文件
“文件/在框架中打开”——选择html文件
用框架面板替换框架文件
❖ 保存框架和框架集文件
框架集文件——“untitledframeset-?.html”
2021/8/2
12
创建和使用框架
❖框架与框架集的概念 ❖创建框架与框架集 ❖选择框架与框架集的方法 ❖设置框架与框架集的属性 ❖使用链接控制框架内容 ❖保存框架与框架集文件 ❖解决浏览器无法显示框架的问题
2021/8/2
13
框架与框架集
❖ 框架可以用来划分网页，是不同的文件可以载 入不同页面的定义区域中。框架是一种先进的
拖动边框不能完全删除一个框架集
Dreamweaver制作框架
Dreamweaver制作框架框架是将浏览器窗口划分成几个部分，将一些不需要更新的元素放在一个框架内作为单独的网页文档，这个文档是不变的，其他经常更新的内容放在主框架内。
框架通常是由框架集和框架两部分组成，框架集实际上是一个页面，这个页面里包含了好多框架窗口，每个框架窗口可以单独显示一个HTML文档，这些HTML文档之间可以通过超链接联系起来，下面我们就使用Dreamweaver CS3快速地创建框架。
一、框架网页框架将一个浏览器窗口分为多个独立的区域，每个区域（框架）显示一个单独的可滚动页面，每个框架都是浏览器窗口内的一个独立窗口。
典型的框架网页如图1所示，这是关于某个电子商务网站的“客户中心”服务页面。
该网页由3个框架组成，每个框架单独显示一张网页。
顶部框架用于显示横幅广告，对应于网页top.html；左侧框架放置客户中心的一些服务列表，用于页面导航，对应于页面left.html；右侧窗口用于显示具体某项客户中心服务的信息，对应于页面right.html。
为了浏览方便，当浏览者单击左侧客户中心服务列表的超链接时，右侧窗口显示相应的客户中心服务信息。
图1 网页中的多个框架二、制作框架网页Dreamweaver CS3提供了多种创建框架的方法，用户可以使用Dreamweaver CS3提供的预置框架集，也可以自己通过手写HTML代码任意地建立框架集。
使用Dreamweaver CS3如何实现如图1所示的结构清晰、风格统一的框架集页面？下面我们就使用Dreamweaver CS3预置的框架集通过操作来实现如图5.22所示的框架集页面。
制作过程如下。
1.新建框架网页要新建框架网页，请事先规划好网页的设计布局，然后执行如下步骤。
(1) 选择“文件”一“新建”命令。
(2) 在“新建文档”对话框中，选择“框架集”类别。
(3) 从“框架集”列表中选择一个合适的框架集，如图2所示。
图2 选择符合自己要求的框架集(4) 单击“创建”按钮，结果如图3所示。
DREAMWEAVER
编辑本段简介
Dreamweaver、FLASH以及在DREAMWEAVER之后推出的针
??
DREAMWEAVER
对专业网页图像设计的FIREWORKS，三者被MACROMEDIA公司称为DREAMTEAM(梦之队)，足见市场的反响和MACROMEDIA公司对它们的自信。说到DREAMWEAVER我们应该了解一下网页编辑器的发展过程，随着互联网(Internet) 的家喻户晓，HTML技术的不断发展和完善，随之而产生了众多网页编辑器，从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器（则原始代码编辑器），两者各有千秋。所见则所得网页编辑器的优点就是直观性，使用方便，容易上手，您在所见即所得网页编辑器进行网页制作和在WORD中进行文本编辑不会感到有什么区别，但它同时也存在着致命的弱点。
界面面板
1. 初识界面
2. 启动面板
3. 对象面板
4. 属性面板
工具简介
组的按钮
1. 插入框架
2. 其他按钮
使用方法
1. 网页制作
2. 构建站点
概述
1. Dreamweaver CS4
2. Dreamweaver CS5
优点
1. 最佳的制作效率
第四个为插入表格式数据，可以将以前作成的表格形状的数据表，直接插入到网页中来，而不用做任何的修改。
第五个按钮为插入水平线按钮，插入后，在属性浮动面板上改改它的大小等。
第六个为导航条，和第二个差不多，也可以换图象，不过，比起第二个要复杂的多，但绝对简单。
第七个为插入层，这好象是 Dreamweaver 特有的特性，其他的网页编辑软件中都没有这项功能。插入的层可以位于页面的任何位置。拖动就行。
网页设计与制作之——框架结构
框架是什么，框架就好比我们的骨骼，支撑着整个网页，如果一个网页没了框架，那么就感觉像一盘散沙，因此为了更好的实现网页的效果，我们就要学会给网页制作一个框架，为了更好的理解什么是框架。
我们画一张示意图来进行讨论。
这是一个左右型的框架，由三个网页文件组成的。
首先外部的框架是一个文件，图中我们用index.htm命名。
框架中左边命名为A，指向的是一个网页A.htm。
右边命名为B，指向的是一个网页B.htm。
下面我们就来从头开始制作一个框架。
1、点“文件”菜单>新建，弹出“新建文档”对话框如下图：或在插入栏>布局>选＂框架：左框架＂如下图：Dreamweaver MX 2004生成一个空白的框架页面，如下图：2、选择「窗口」菜单＞“框架”，弹出“框架”面板如下图。
从框架面板可知，系统对左右框架生成命名。
左框架名为：leftFrame，右框架名为：mainFrame，当然您可以通过框架属性面板对框架重新命名，了解这一点非常重要。
创建超级链接时，要依据它正确控制指向的页面。
3、保存框架。
选择“文件”菜单点击“保存全部”。
系统弹出对话框。
这时，保存的是一个框架结构文件。
我们按照惯例都命名为index.htm。
保存的时候如果虚线框笼罩的是周围一圈就是保存框架结构。
（下图）虚线笼罩在右边就是保存框架中右边网页。
（如下图）虚线笼罩在左边就是保存框架中左边的网页：（如下图）三个页面保存完毕。
4、下面我们要实现按左边的超级链接，对应的页面出现在右边。
在左边的页面中做上超级链接。
指向一个已经存在的页面。
注意做好链接以后，要在目标栏中设置为mainFrame。
(如下图）6、设置完毕，保存全部，按F12预览网页。
链接指向的页面出现在右边框架中。
7、重复以上步骤，把左框架所有的链接做完，一个简单的网站导航结构创建完成。
更多Dreamweaver 教程请继续访问建站学的Dreamweaver教程专区。
实验七框架结构【实验目的】：通过本实验，使学生熟悉创建、编辑框架网页和利用框架来布局页面的基本方法。
DWmx基础教程
2、框架的应用
创建普通框架集
利用框架属性面板来设置该框架 是否要边线以及边线的颜色、边线 宽度、框架的名称和框架中所要显 示的源文件。
可以查看框架集的文件的源代码， 这里面只保存了框架信息和它所对 应的源文件。
3、隐形框架的应用
实际就是<iframe></iframe> 的应用
三、 层的应用
层是网页中的一种容器，它可定位 在页面上的任意位置，并且其中可 包含文本、图像、表单等所有可直 接用于文档的元素。
命令可实现该操作。
6、创建图片热点
在插入的图片上，可以是交换式图 片，可以把图片分为若干个区域， 每个区被称为“热点”，可以为每 个热点指定相关的链接。当单击某 个热点时，系统显示相关的网页。 当绘制完热区后，属性面板会显示 热区的属性。
还可以调整热点区尺寸。
7、插入水平线
在对象面板中选择按钮，在页面中 点击，画面会自动生成一条水平线， 在水平线上单击，可以设置水平线 的宽度、高度、对齐方式、是否有 阴影等参数。
表单的应用P56－68
表单的创建与设置 表单类型
文本字段 文本域 按钮 单选按钮 复选按钮 下拉菜单 隐藏域
模板的运用 1．准备模板 2．定义区域 3．应用模板
感 谢
8、插入日期
在对象面板中选择按钮，在页面中 点击，会弹出对话框，可以设置日 期格式、星期格式、时间格式，点 击“OK”，就会在页面中自动加上 时间。
9、插入Flash对象 （1）插入Flash影片 （2）制作Flash文字 （3）制作Flash按钮
二、网页布局
网页布局主要使用到了表格、框 架、dw中网页布局以及隐形框架 的使用
到需要插入的图片文件，选择“确 定”。
dreamweaver第十章 框 架
框架的作用是把浏览器的显示空间分割为几个部分，每个部分都可以独立显示不同的网页。
一个使用了框架的网页，可以看到，左侧是各个讨论区的名称，单击任意一个讨论区名称，在网页的右侧就会显示相应讨论区的内容，左右两边是独立显示的，例如拉动左侧的滚动条，不会影响右侧的显示效果，反之亦然。
与框架相关的概念是框架集，把几个框架组合在一起就成为了框架集。
10.1理解创建框架和框架集的核心概念在Dreamweaver中，可以非常方便地通过可视化的方法创建框架和框架集。
首先选择菜单“查看→可视化助理→框架边框”命令，这时文档窗口的边缘会显示出一个突起的边框。
用鼠标拖拽边框，就可以把窗口一分为二，4条边框都可以拖拽。
拖拽上下边框可以把窗口分为上下两个部分，拖拽左右边框可以把窗口分为左右两个部分。
如果从窗口的角上开始拖拽鼠标，窗口会被分成4个部分。
拖拽鼠标可以移动刚刚生成的分割线。
当窗口被分割为几个框架以后，每个框架都可以作为独立的网页进行编辑，也可以直接把某个已经存在页面赋给一个框架。
此时打开HTML面板，可以看到相应的HTML代码如下。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN""/TR/html4/frameset.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>无标题文档</title></head><frameset rows="64,97" cols="*"><frame src="file:→E|/dwr/MyFirstSite/UntitledFrame-1"><frame src="file:→E|/dwr/MyFirstSite/page5.htm"></frameset><noframes><body></body></noframes></html>这段代码与以往的网页代码有所不同。