Dreamweaver 3.0简明使用手册 张金贵 2000年 第53期 Dreamweaver 3.0是Macromedia公司推出的新一代网页编辑软件。它强大的多媒体网页设计功能和与其它图像编辑软件、文字处理软件的高度紧密的结合,完全开放的插件环境。同时由于它具有许多优秀的网页编辑和网站管理功能,所以它一出现就得到了众多网页设计者的青睐。 #1 一、Dreamweaver 3.0的功能 #1 1.网页编辑 Dreamweaver 3.0是一个所见即所得的网页编辑软件,你不需懂得HTML语言,就可以轻松制作出自己的主页。Dreamweaver提供了强大的文本、图像和表格编辑功能。此外,你还可以在网页中插入各种插件(如Javascript、ActiveX、VBscript等)来实现各种各样的特殊效果。与Macromedia公司的其它软件完美协作也是Dreamweaver的一大特色,你可以在Dreamweaver中直接插入Flash动画和使用Fireworks制作的图像。 #1 2.网站管理 Dreamweaver 3.0还是一个功能强大,可视化的Web网站管理工具,利用它你可以方便地对站点进行管理,采用不同的方式查看各个网页之间的关系,调整站点的组织结构,自动更新链接和生成站点地图等。 #1 3.网站发布 网页制作完毕之后就需要把它发布到Internet网上。Dreamweaver 3.0提供了一个非常简便的发布工具,利用Dreamweaver内置FTP的功能,你只需单击一个按钮,Dreamweaver就会帮你完成所有的网页发布工作。 #1 二、Dreamweaver 3.0的用户界面 单击“开始”按钮,指向“程序”菜单,单击选择“Macromedia Dreamweaver”中的“Dreamweaver3”,即可启动Dreamweaver 3.0。 Dreamweaver 3.0的界面非常简洁,它除了三个浮动面板外,剩下的就是一个面积很大的工作区了,而且这三个浮动面板也可以随时关闭,这就为网页制作者提供了一个广阔的设计平台。 1.标题栏:显示当前打开的站点和正在编辑的网页标题和名称。 2.菜单栏:列出了Dreamweaver 3.0的下拉命令菜单,分别是:File(文件)、Edit(编辑)、View(查看)、Insert(插入)、Modify(修改)、Text(文本)、Commands(命令)、Site(站点)、Window(窗口)、Help(帮助)。 3.工作区:屏幕中间的较大一块空白区域就是你制作网页的平台。 4.状态栏:用于显示当前页面的状态信息。 5.属性面板(Properties):显示选定对象的各种属性,根据所选择对象的不同而显示不同的属性内容,你可以直接在属性面板上修改不同的参数来改变对象。 6.启动面板(launcher):上面集成了七种工具,分别是:Site(站点管理器)、Library(库项目管理器)、HTML Styles(HTML样式编辑器)、CSS styles(层叠样式表编辑器)、Behaviors(行为检查器)、History(历史记录)、HTML Source(HTML源代码编辑器)。单击即可打开相应的对话框。 7.对象面板(Objects):包含了可以插入网页中的各种类型的对象。如图像、表格、层、Java小程序、Flash动画等。Dreamweaver 3.0的对象面板包含的可插入对象。共分成六组,分别是Common(普通)、Characters(特殊符号)、Forms(表单)、Frames(框架)、Head(页头标记)、Invisibles(隐藏元素),它们之间可以通过单击对象面板右上角的三角符号来进行转换。每组面板包含的对象分别是: (1)Common面板:包括最常用的对象,有图像、表格、翻转图像、水平线、导航条、层、换行符、E_mail链接、表格数据、日期、Flash动画、Shockwave,Generator,Firewrks HTML代码、Java小程序、Activex插件和服务器端包含的文件。 (2)Characters面板:包括注册商标符号、版权符号、英镑、人民符号、连接符等一些特殊符号。 (3)Forms面板:包含创建表单和表单元素的按钮,有表单域、文本框、按钮、复选框、单选框、下拉列表、文件框、图像框、隐藏框、跳转菜单。 (4)Frames面板:列出了八种框架方式供你选择,基本上可以满足我们日常制作网页的需要。 (5)Head面板:包含添加不同head元素的标签,有Meta、Keywords、Description、Refresh、Base、Link。 (6)Invisibles面板:网页中不可见的对象,包括Named Anchor(命名锚点)、Comment(注释)、Script(脚本)、Non-breaking space(空格)。 #1 三、网页制作基本操作 #1 (一)建立一个新网页 在Dreamweaver中建立新网页有两种方法:一是单击“File”菜单中的“New”命令;二是选择“File”菜单中的“New From Template”选项,选择一个模板创建新网页。 #1 (二)设置页面属性 选择“Modify”菜单下的“Page properties”(页面属性)选项,打开“页面属性”对话框。 在对话框中,我们可以修改各项设置,其中各项目的含义如^00100015a^: 对于颜色设置,可以单击右边的颜色框,在弹出的调色板中进行选择,也可以从Dreamweaver 3.0内置的颜色配色方案中进行选择。 #1 (三)插入文本 文本是网页中必不可少的组成部分,可以直接输入,也可以利用剪贴板从其他应用程序中粘贴。在改变文本的格式之前,首先应选中它,然后利用文本的属性面板设置文本的字体、字号、颜色、字体样式、对齐方式等,面板中各项的含义如^00100015b^: 使用列表功能可以将文本排列得规则整齐,条理清晰,Dreamweaver 3.0的列表样式有Bulleted list(项目条列表),Numbered list(编号列表),Directry list(目录列表)和Menu list(菜单列表),你可以根据自己的需要灵活选用。 要创建新的列表,可采取以下操作: 1.将光标移动到要添加新文本的位置。 2.单击文本属性面板上的“Unordered list”(无序列表)或“Order list”(有序列表)按钮。 3.输入列表内容,按Enter键确认,自动添加下一条列表符号,继续输入列表内容,然后按Enter键确认,重复此操作。最后一条列表内容输完后,按两次Enter键,结束列表输入。 #1 (四)插入图像 把插入点移动到要插入图像的位置,选择“Insert”菜单中的“Image”选项,或者选择“Object”面板上的“Common”组,然后单击“Image”图标。即可在当前位置插入一幅图像。 通过属性面板可以修改图像的各种属性,图像属性面板上各项的含义如^00100015c^: 1.创建转换图像 所谓转换图像,就是指当鼠标移到该图像上时图像立刻换成了另一幅图像,利用它可产生一些图像变换效果,为网页增辉。转换图像事实上就是两幅图像交替出现。创建转换图像的方法是: (1)指定要插入转换图像的位置。 (2)选择“Insert”菜单中的“Rollover lmage”选项或从“Objct”面板(Common组)上单击“Rollover”图标。 (3)在出现的对话框中进行设置。设置完毕,单击“OK”按钮。 2.建立图像映射 图像映射就是在一幅图像上画出不同的区域,每一块区域叫做一个热区,与一个超链接相对应,当鼠标移动到该区域内单击左键,就可以跳转到此超链接所指的网页中,“Map”功能就是专门用来建立图像映射的。建立图像映射的方法是: (1)选定图像,然后在图像属性面板的右下角单击要创建的图像映射的形状(矩形、圆形或多边形)按钮,在图像上拖动鼠标画出选择的形状。 (2)随后在弹出Map属性面板上设置该热点的一些参数如^00100015d^。 #1 (五)插入表格 1.创建表格 (1)将光标停留在要插入表格的位置。 (2)单击“Insert”菜单中的“Table”选项。 (3)在出现的对话框中设定表格的各种参数如^00100015e^: (4)单击“OK”按钮,一个表格即插入到页面的当前位置。 选定刚才建立的表格,可在属性面板中设置整张表格的属性如^00100015f^: 将光标置于某个单元格内,也可选定多个单元格,设置一个或多个单元格的属性。它的设置方法与设置整张表的属性相同。 其它对表格的操作如:合并单元格、拆分单元格、插入行或列、删除行或列等都可以在“Modify”菜单的“Table”选项中设置。 2.格式化表格 Dreamweaver 3.0内置17种表格样式模板,你只需使用Format table(格式化表格)命令就可以在众多的表格样式中选择一款。 格式化表格的使用方法是: (1)选定要格式化的表格。 (2)单击“Commands”菜单下的“Format table”命令。在出现的对话框中选择表格样式。 (3)单击“OK”或“Apply”按钮即可对表格应用选定的样式。 如果对选定的样式不甚满意,可在对话框中修改各个参数如^00100015g^: #1 (六)插入表单 表单是用户与网站交流信息的窗口,通过表单用户可以向服务器传递信息,而网站也能通过表单来收集用户的信息。 在添加表单对象前必须先向网页中添加表单,因为表单对象只有放入到表单中才能发挥作用。方法是: 选择“Insert”菜单中的“Form”选项,或单击“Object”面板(Form组)中的图标,即可在页面中的当前位置插入一个带红色虚线框的表单,然后就可以向表单中添加各种表单对象了。具体的操作方法是:在“Forms”对象面板上单击要添加的表单对象图标或从“Insert”菜单“Form object”选项中选择需要的表单对象。 Dreamweaver 3.0包括的表单对象有:Text field(文本框)、Button(按钮)、Check box(复选框)、Radio button(单选按钮)、List/menu(列表/菜单框)、File field(文件框)、Image field(图像框)、Hidden field(隐藏框)、Jump menu(跳转菜单)。 用户在网页中填完表单内容,单击“Submit”(提交)按钮,所填写的数据就被提交到了网站服务器上,服务器将自动启动CGI(公共网关接口)服务器程序,用来读写数据库,分析用户输入的信息,并给出处理结果,生成新的网页,然后显示在用户的屏幕上。 #1 (七)建立框架 框架是一种特殊的网页,它将浏览器的窗口分成几个小窗口,每个小窗口都可以显示一个独立的网页,各个窗口之间还可以设置超链接,这样就使网页看起来更有条理,结构更清晰。 1.建立框架的两种方法 (1)选择“Modify”菜单下的“Framset”选项,其中包括四项内容:“Split frame left”(“Right”、“Up”或“Down”),含义分别为向左(右、上、下)划分框架。 (2)选择“View”菜单下的“Frame borders”(框架边框),然后按住Alt键在文档窗口中拖动框架边框,将框架纵向或横向划分。 由于框架集中包括多个页面,所以它的保存要复杂些,在保存时,你可以选择保存某一个框架中的页面或保存整个框架集文件。 2.建立框架之间超链接的方法 (1)逐一选定各个框架,然后在属性面板中分别命名。 (2)在某一个框架中选定文本或图像并给它们建立超链接。 (3)选定某个链接,然后在属性面板中的“Target”框中指定要打开该链接页面的目标框架。 #1 (八)其他网页元素 1.水平线(Horizontal rule) 选择“Insert”菜单中的“Horizontal rule”选项,或单击面板中的“Horizontal rule”图标,即可在当前位置插入一条水平线。 2.导航条(Navigation bar) 从“Insert”菜单或“Object”面板中选择“Navigation bar”选项,出现一个插入导航条对话框,单击“+”、“-”按钮可以增加或删除导航条元素,向上和向下三角按钮用来改变导航条元素的顺序。 3.脚本(Script) 从“Insert”菜单或“Object”面板(Invisibles组)中选择“Script”选项,出现一个对话框,你可以在“Language”中选择要插入的脚本类型(Javascript或Vbscript),在“Content”中键入脚本的内容。 4.多媒体元素 利用Dreamweaver 3.0可以很轻松的插入Macromedia公司其他多媒体新产品生成的文件。如Flash shockwave、Generator、Fireworks生成HTML文件,还可以插入Java applet、ActiveX、Plugin等元素。其方法是选择“Insert”菜单下的“Media”选项或从“Object”面板中直接单击相应文件的图标即可。 #1 四、使用模板和库 #1 (一)应用模板创建网页 1.建立新模板 (1)选择“Window”菜单下的“Templates”选项。 (2)在“Templates”浮动面板内,单击窗口右上角的三角按钮,在弹出的菜单中选择“New template”命令。窗口内将出现一个新的未命名模板,你可以给它起个易区别、易记忆的名字。 2.编辑模板 在“Templates”浮动面板内双击建立的模板名,打开建立的模板。在默认状态下,模板是锁定的,你可以向模板中增添内容,但在保存时所有的内容都将标记为不可编辑,这样的模板是无法用来创建新文档的。因此你要使模板可用来创建新文档,就必须要在模板中建立可编辑的区域。 3.建立可编辑区域 (1)将已有内容标记为可编辑区域 首先在模板文档中选定内容,然后选择“Modify”菜单中的“Templates、Mark selection as editable”选项,在出现的“New editable region”对话框中键入区域名,单击“OK”按钮,所选定的区域内容将突出显示。 (2)新建可编辑区域 首先将光标移动到要新建可编辑区域的位置,然后选择“Modify”菜单中的“Templates”、“New editable region”选项,在出现的“New editable region”对话框中输入区域名,单击“OK”按钮。可以看到在模板中出现了一块突出显示的用括号包围的区域(例如“这是可编辑区域”)。当你将此模板应用于文档之后,你就可以使用相应的网页内容替换这块区域中的内容了。 4.取消可编辑区域 如果你想把已标记为可编辑区域的内容取消,让其转换为不可编辑区域,可以进行以下操作: 选择“Modify”菜单的“Templates”、“Unmark editable region”选项,在出现的“Unmark editable region”对话框中选择区域名,然后单击“OK”按钮,该区域即被锁定为不可编辑区域。 5.保存模板 对于上面编辑完成的模板,单击“File”菜单中的“Save”命令,即可将其保存,同时在“Templates”浮动面板中将出现该模板的内容。 如果你想将一个文档保存为模板文件,单击“File”菜单中的“Save as template”命令,在出现的对话框中选择一个站点,然后在“Save as”框中输入模板名,单击“Save”按钮即可。 6.应用模板 建立模板的目的是为了方便、迅速地创建文档,要基于模板创建一个新文档,可进行以下操作: 选择“File”菜单下的“New from template”选项在出现的选择模板对话框中分别选定一个站点和模板文件,然后单击“Select”按钮。 要对已打开的文档应用模板可选择以下操作: (1)选择“Modify”菜单下的“Template”、“Apply template to page”选项,在出现的对话框中分别选定站点和模板名,然后单击“Select”按钮。 (2)在“Template”面板中拖动模板到当前文档中。 7.应用模板更新站点 如果你修改了站点中的某个模板,Dreamweaver 3.0将提示你更新所有应用了该模板的文档。其方法是: 选择“Modify”菜单下的“Template”选项: (1)如果想更新当前页面,单击“Update current page”命令。 (2)如果想更新整个站点或是使用了该模板的所有文档,选择“Update pages”命令,在出现的更新页面对话框中设置查找范围、选定站点,同时选中“Update”中的“Template”选项,单击“Start”按钮。 #1 (二)应用库制作网页 库和模板的功能类似,使用方法也大同小异,二者的区别在于:模板是应用于整个网页版面类似的多个网页中,而库只是整个网页中的一部分内容,所以可以在一个页面中使用多个库或者多次使用一个库。对于需要在众多网页中重复的少量内容(例如新闻标题),利用库功能可以大大减轻工作量,提高你的工作效率。 #1 五、动态网页制作 #1 (一)层的操作 层是重叠显示网页内容的各个对象的一种新手段。利用它,网页设计者可以对包括文本和图像在内的所有元素进行强制定位,改变图文重叠顺序,显示或隐藏图文。同时层也是创作时间线动画的基础,利用层你可以设计出丰富多彩的动画。 在层中可以包含文本、图像、表格、插件等任何HTML元素,甚至你还可以在层中再插入层。层技术的应用为创作出更精彩的网页提供了可能。 1.创建层 要在文档中建立一个层有以下几种方法: (1)选择“Insert”菜单中的“Layer”选项,Dreamweaver 3.0会自动在光标所处位置插入一个层标记。 (2)按住“Objects”面板中的“Draw layer”图标,然后将其直接拖拽到文档中的合适位置释放鼠标,即可在当前位置插入一个层。 层建立后即可在其中插入文本、图像、表格、动画等任何可以放置到HTML文件中的对象。 2.设置层属性 打开层属性面板,我们可以在其中设置层的各种属性如^00100015h^。 3.设置层参数 选择“Edit”菜单下的“Preferences”选项,在出现的对话框中选择“Layer”类别,即可定义要建立的层的参数如^00100015i^。 4.编辑层 (1)调整层的大小 有以下几种方法:先选中层,然后拖动层周围的调整柄;在层属性面板中输入W和H值;要每次重调1个像素大小,可在选中层后按Ctrl+方向键。 如果要一次调整多个层的大小,首先选中多个层,然后选择“Modify”菜单中的“Layers and hotspots”选项下的“Make same width”或“Make same height”命令。 (2)对齐层 使用对齐层功能,可以一次将多个层按一定的方式对齐,在对齐多个层时将使用最后被选定的层指定的边框为基准。操作方法是:先选中各个层;然后选择“Modify”菜单下的Layers and hotspots,选择其中的Align left(左对齐)、Align right(右对齐)、Align top(顶端对齐)、Align bottom(底端对齐)。 (3)移动层 将鼠标移到层的边框上,当鼠标变成多向箭头后,拖动层到新位置后释放即可。 如果想每次移动一个像素,请在选中层后使用方向键(上、下、左、右);按住鼠标拖动的同时使用方向键,可一次移动5个像素。 #1 (二)样式表的使用 样式表(Style sheet)是DHTML的一大特色,利用样式表可以制作具有自己风格的网页,它的全称是层叠样式表(casacading style sheet,简称CSS)。如果你想让自己的站点具有统一的格式,你只需制作一个样式表,则所有被指定的网页都有会使用相同的格式。创建一个新样式表的具体方法是: 首先打开样式表浮动面板,方法是:选择“Window”菜单下的“CSS styles”选项或单击状态栏中的“CSS styles”按钮。 单击窗口右下角的“New styles”按钮,出现一个新样式表对话框。在“Type”(类型)中选择一种类型。 (1)如果选择“Make custom styles (class)” 选项,请在“Name”框中输入样式表的名称,注意:该名称必须以英文句点开头。 (2)选择“Redifine HTML Tag”选项,就需在“New style”框中键入或选择一个HTML标签。 (3)如果选择“CSS selector”,可以键入或选择一个选择器。 选择“Make custom styles (class)”选项,然后单击“OK”按钮,将弹出定义样式表的对话框,我们可以设置各种参数。如字体类型、大小、颜色、背景色等,设置完毕,单击“OK”按钮,可以看到建立的样式表已经出现在样式表面板中,选中样式表,然后在“Apply to”中选择样式表要作用的范围,单击窗口中的“Apply”按钮,即可将该样式表作用到选用的范围上。 要想删除样式表,首先应选中它,然后单击样式表面板中的“Delete style”按钮。 #1 (三)行为的应用 行为(Behavior)功能就是在网页中插入Javascript代码,帮助用户实现Javascript特效,Dreamweaver 3.0自带了20多种特效,基本上可以满足日常的需要。 行为是事件(Events)和动作(Actions)的组合,是一段由事件引导动作产生的过程。例如按下某个按钮弹出一个“欢迎”窗口的例子中,按下按钮就是事件,而弹出窗口就是动作。 1.添加行为效果 下面以一个实例来说明如何给一个对象添加行为效果,我们要实现的特效是:当你在图片上单击鼠标时,会弹出一个说明窗口。具体操作是: (1)首先选择“Window”菜单下的“Behaviors”选项,打开行为面板。 (2)选择一幅图像,在行为面板中单击“+”按钮,弹出一个动作菜单,从中选择“Pop message”(弹出窗口)选项。 (3)屏幕上将出现“Pop message”参数设置对话框,在其中键入提示窗口中需要出现的内容,单击“OK”按钮。 (4)该行为已被添加到图像上,由于系统默认的事件与要实现的不同,因此单击“Events”列表中的下拉菜单中选择“On mousedown”选项。 (5)按F12键,进行预览,在图像上单击,即会弹出说明窗口。 2.编辑行为效果 同一个对象可以添加多个的事件,而同一个事件又可以有多个不同的动作,它们都按照字母顺序出现在行为面板中,你可以任意的添加、删除或改变它们的执行顺序。 (1)单击“+”按钮,可以为当前选择的对象添加新的动作,单击“-”按钮,可以删除动作。 (2)单击向上或向下按钮可以改变动作顺序。 (3)要改变某个动作的参数,请直接双击该动作,就会出现参数设置对话框。 3.认识行为面板 单击状态栏中的“Behavior”按钮或选择“Window”菜单下的“Behaviors”选项,行为面板将出现在屏幕上。 (1)“+”或“-”按钮,用来增加或删除动作。 (2)“Events for”框用于选择浏览器类型,共有3.0+4.0 browser、4.0 browser、IE3.0、IE4.0、Netscape3.0、Netscape4.0六种选项。 (3)使用向上和向下按钮用以调整动作发生的先后顺序。 (4)“Events”事件列表,列出所有可以触发动作的事件。 (5)“Actions”动作列表,显示所有添加的动作。 #1 (四)利用Timeline(时间线)创建动画 时间线(Timeline)功能是Dreamweaver 3.0的一个独创,它通过改变层的位置、大小、透明度和叠放顺序等来创建动画。由于层中可以放置各种对象(文字、图像、表格等),因此,你能创建的动画内容非常丰富。同时,用时间线还可以对页面的各种行为进行设置,这就使得我们所编辑的网页更富于变化,也更精彩。 1.认识Timeline(时间线)面板 选择“Window”菜单下的“Timelines”命令,就可以打开时间线浮动面板。面板的最上一栏分别是“Behavior”和“Timeline”选项卡,单击三角形按钮可以弹出一个包含各种操作时间线的命令的菜单。 面板第二栏是时间线控制功能,包括: (1)时间线选择框,包括建立的各个时间线的名称,当你建立多个时间线时可以用这个选择框实现各个时间线的快速转换。 (2)倒带,返回到时间线的第一帧。后退,时间线向后退一帧。 (3)显示当前的帧位置。 (4)播放,单击一次前进一帧,按住鼠标不放,可以实现时间线的连续播放。 (5)“FPS”时间线的播放速度(帧每秒)。 (6)“Autoply” 载入页面时自动播放时间线。 (7)“Loop”打开网页时动画将循环播放。 行为栏(下面标有大写字母B),可以在任意位置上增加相应的行为以增强对页面的控制和对外界的适应。 标尺(行为栏下面),标尺上有一个红色的监视块,它表明了当前的显示状况。标尺下标明1、2、3等数字的就是你创建的各个时间线。 2.创建一个简单的动画 (1)将光标停留在要插入动画的位置,单击“Insert”菜单下的“Layer”命令,插入一个层。 (2)在层中插入各种对象,可以通过单击“Insert”菜单下的相应命令或从对象面板中选择相应的对象按钮。 (3)选择“Modify”菜单下的“Timeline”、“Add object to timeline”命令,或直接拖动该层到时间线面板中。 (4)在时间线的第1个项目中将出现一个紫色条,对象即被添加到时间线的第一帧。 (5)单击时间线的末端关建帧标记,然后用鼠标拖动层到新的位置。 (6)用鼠标按住播放按钮,就可以看到动画效果,如果你想看到它的动态效果,可以在浏览器中预览。 注意:按上面步骤制作的动画只能按直线运动,如果要想使它按曲线运动,可进行以下操作: (1)按住Ctrl键,然后在时间线上某一帧处单击。 (2)单击时间线上的某一帧,然后选择“Modify”菜单下的“Timeline”、“Add keyfram”。 如果你想将其他图像和层添加到时间线中,可以重复以上过程,这样就可以创建出更复杂的动画来。 3.创建沿一定路径运动的动画 你可以让动画沿着你设定的路线进行运动,这样设计出来的动画更具有艺术性和创造性,也更能够吸引人。它建立的具体方法是: (1)选择“Insert”菜单下的“Layer”命令,并向层中添加内容(文字、图像、表格等)。 (2)选中刚才建立的层,选择“Modify”菜单下的“Timeline”、“Record path of layer”。 (3)用鼠标拖动层在页面上运动,层走过的地方将出现它的运动轨迹,拖动到合适位置释放鼠标。我们可以在时间线面板中看到一个新的项目,并带有一定数目的关键帧。 (4)在时间线面板中按住“Play”(播放)按钮或保存后在浏览器中预览动画,我们可以看到动画在沿着我们刚才划过的轨迹运动。 4.在时间线上应用行为(Behavior) 在时间线中的某个帧上应用行为,这样就可以创作出更复杂动人的时间线动画。在时间线上添加行为的方法是: (1)选中行为栏中的某一帧,选择“Modify”菜单下的“Timeline”、“Add behavior to timeline”选项。 (2)此时屏幕上将弹出一个提示框,告诉你单击行为面板中的“+”按钮可以向时间线中添加行为,单击“OK”按钮。出现行为面板,我们就可以利用“+、-”按钮来增加或删除行为。 (3)利用同样的方法,还可以向其他帧添加行为。 (4)如果要删除添加的行为,可先选中包含该行为的帧,然后从“Modify”菜单下的“Timeline”选项中选择“Remove behavior”命令。 #1 六、网站管理 Dreamweaver 3.0强大的站点管理功能可以让我们方便快速地建立自己的网站。Dreamweaver 3.0的站点(Site)功能不仅包括了树状结构显示、自动更新链接、自动生成站点地图、自动复制文件到当前站点,而且允许用户在站点中直接对网页的部分标签进行修改,检查单个页面对各种版本浏览器的支持情况等,利用Dreamweaver 3.0自带的FTP功能可以及时将你的网站发布到Internet上,而且是所见即所得的形式。 #1 (一)建立网站 所谓站点,就是存放网站内容的地方,它可以在本地或远程服务器上,在将站点发布到远程服务器之前,必须首先在本机上建立本地站点,制作完成之后,再发布到远程服务器上,供用户浏览。 1.建立本地站点 启动Dreamweaver 3.0,选择“Site”菜单下的“New site”命令,将出现“Site definition”对话框。从对话框的“Category”列表内选择“Local Info”,其中各个选项的含义是: (1)Site name(站点名称):为自己的站点起的标识名称。 (2)Local root folder(本地根目录):指定站点存放的文件夹,可以直接输入路径,也可以单击右面的文件夹图标进行选择。 (3)HTTP Address(HTTP地址):站点在Web上的网址。 (4)Cache(高速缓存):选择此项,可以建立高速缓存以改善链接速度和站点管理任务。如果不选择此项,Dreamweaver将提示你在创建站点之前创建高速缓存。 各项设置完成后,单击“OK”按钮,就会出现“Site”窗口。 2.增加网页 站点目录建立之后,里面还暂时没有内容,我们要把自己规划好的网页全部添加到该目录下。添加网页的方法是: (1)在“Site”窗口中选择“File”菜单下“New file”选项,Dreamweaver就会在当前站点目录下添加一个名字为Untitled的HTML文件。请在“File”菜单中选择“Rename”命令,对其重新命名。 (2)在当前站点目录窗口右键单击,从弹出快捷菜单中选择“New file”命令添加新文件夹,方法同上。要说明的是想在哪个文件夹下添加文件或文件夹,就需要先选中该文件夹,然后再重复以上介绍的添加文件(夹)的步骤。 3.设置网站主页 要将某个文件指定为网站的主页,先选中该文件,然后选择“Site”菜单的“Set as home page”选项。 需要说明的是:如果将站点根目录下某个文件命名为Index.htm,Dreamweaver将自动将它设置为网站的主页。 4.编辑各个网页的内容 添加完各个网页之后,紧接着我们就要给每个网页添加具体的内容,方法是双击该文件,Dreamweaver将打开一个空白文件供你编辑,你可以在网页中输入文字、图像、动画、表格、设置超链接、插入Shockwave电影、Flash动画、定制表单等各种元素。 5.建立各个文件之间的链接 要在文档中建立网页之间的超链接,首先在文档窗口中选定作为链接的文字或图像,然后采用以下方法建立超链接: (1)如果是绝对超链接,可直接键入要链接的网站的网址,例如新浪网的网址http://www.sina.com.cn。 (2)如果要链接到本网站的其他网页,可键入该网页的路径和文件名。 (3)要链接到本网页中的锚链接位置,可键入符号“#”和锚链接名。例如,要链接到当前文件的“3”锚链接,键入#3,要链接到要相同文件夹下其他文件的“3”锚链接,键入文件名.htm#three。 (4)电子邮件链接,可键入“Mailto:”+电子邮件地址。 (5)Script(脚本)链接,可直接执行Javascript代码或调用Javascript函数执行相应的功能。在Link框中键入:″javascript:″+javascript代码或函数。例如,键入“Javascript:alert(′感谢你的光临!′)”,该链接将弹出一个Javascript提示框,显示输入的相应内容。 (6)Nowhere(无地址链接),直接输入“#”号。Nowhere链接不会跳转到任何地方,它对于读取某些Javascript事件非常有用。 #1 (二)发布网站 对Dreamweaver 3.0来说,它内建有FTP功能,利用它,能够很方便地将自己的网站发布到因特网上去。 在用Dreamweaver 3.0发布网站之前,首先要对一些参数进行设置。在“Site”窗口中,单击“Site”菜单下的“Define sites”选项,在出现的对话框中选中你要发布的网站,然后单击“Edit”按钮,在出现的“Site definition”对话框中选择“Web server info”,在“Server access”的下拉菜单中有三个选项:“None”、“FTP”、“Local/network”,它们的含义分别是: None(无):只使用本地站点,不上传到服务器,系统默认该选项。 Local/network(使用本地局域网):如果你的服务器被设置为网络驱动或是你正在本地机器上远行Web服务器,可在随后出现的对话框中选择站点文件存放的文件夹。 FTP:用FTP功能上传网站。我们选择FTP选项,在随后出现的对话框中设置登录远程服务器的各项信息: 1.在“FTP host”框中键入要上传到的网站的主机名。例如:www.163.com或网站的IP地址202.103.176.81 2.在“Host directory”框中键入你存放网页的位置。 3.在“Login”框中键入登录名,即你申请时的用户名。 4.在“Password”框中键入密码,同时应选中“Save”项,使系统自动保存密码而不用每次登录时都要重复输入密码。 5.选中“Use firewall”使用防火墙。 设置完成后,单击“OK”按钮,然后返回到Site窗口,单击工具栏中的“Connect”按钮,Dreamweaver就开始与远程服务器建立连接,连接成功后,就可以从“Local folder”域中选择文件或文件夹,然后单击工具栏中的“Put”按钮,开始上传。同理,在“Remote site”域中选定文件,然后单击工具栏中的“Get”按钮,就可将该文件下载到本地硬盘中。 网站上传成功之后,我们还应用浏览器打开仔细地浏览一遍,查看一下所有的网页是否都能正常显示。