认识Dreamweaver教案
1、了解Dreamweaver界面和面板操作方法;
2、掌握Dreamweaver站点的操作方法;
3、掌握Dreamweaver站点文件的操作方法。
教法教具:演示法、讲授法、提问法、讨论法、比较学习法 教学过程:
讲授新课:
认识Dreamweaver:
一、打开DM:
开始—程序—Adobe Dreamweaver—
二、认识DM:
标题栏、菜单栏、工具栏、编辑栏、状态栏、面板。工具栏:视图—工具栏—插入/文档/标准。面板:窗口—相应面板。折叠面板/展开面板。
三、网页制作步骤:
创建文件—设置标题—编辑内容—保存文件—浏览器查看效果。浏览网页:
1、在编辑状态下,按F12浏览。
2、保存文件,打开浏览器,打开文件浏览。
站点操作:
一、新建站点:
方法:
1、站点—新建站点;
2、站点—管理站点—新建—站点;
3、文件面板—站点下拉菜单—管理站点—新建—站点 步骤:
方法1:基本选项—给站点命名—不使用服务器—确定站点存储位置(选
Adobe Dreamweaver CS4 择已有文件夹或新建文件夹)--选择无远程服务器—完成。
方法2:高级选项—输入站点名称—选择本地根文件夹位置(选择已有文件夹或新建文件夹)
二、编辑站点:
方法:
1、站点—管理站点—选择站点—编辑—修改站点名称或存储位置;
2、文件面板—站点下拉菜单—管理站点—选择站点—编辑—修改站点名称或存储位置。
三、复制站点:
方法:
1、站点—管理站点—选择站点—复制;
2、文件面板—站点下拉菜单—管理站点—选择站点—复制。
四、删除站点:
方法:
1、站点—管理站点—选择站点—删除;
2、文件面板—站点下拉菜单—管理站点—选择站点—删除。
注意:站点删除后,仅删除了站点在DW中的指向,并未删除站点文件夹,站点文件夹的内容仍然存在。
五、建立站点的优点:
当站点下文件的位置或文件名发生变化时,与之相关联的文件能提示更新,使关联不发生错误。
站点下文件的操作:
一、新建文件:
方法
1、文件—新建—Html—创建 方法
2、文件面板:
折叠状态:右击站点名称或站下文件夹—快捷菜单选择“新建文件”
展开状态:文件—新建文件 注意:
可以通过第一种方法新建基于某种模板的新文件。
二、复制文件:
文件面板—文件名称上右击—编辑—复制。
三、重命名文件:
在文件面板下选择站点下的文件名称:
1、文件名称上右击—编辑—重命名
2、单击文件名称--按F2
3、两次单击文件名称
注意:
在站点给文件重命名后,若有文件与之相关联,会给出更新提示;而在资源管理器给文件重命名不会给出提示。
四、删除文件:
文件面板—选择站点下的文件名称—右击—编辑—删除或按Del。
注意:
在站点下删除文件后,站点下的文件被真删除。
在站点下删除文件,若有文件与之相关联,会给出提示;而在资源管理器删除不会给出提示。
五、新建文件夹:
文件面板—站点下的某文件夹位置上右击—新建—文件夹。
课后作业:
1、在Dreamweaver中新建本地站点有哪些方法?如何新建本地站点?
2、在Dreamweaver中新建html文件有哪些方法?
3、在Dreamweaver中,删除站点与在资源管理器删除站点文件夹效果是否相同?
4、在Dreamweaver中,删除站点内文件与在资源管理器删除站点内文件效果是否相同?
弹出菜单在网页制作中是一种非常常用的菜单方式,这种菜单不但制作简单,而且效果也很
好。
效果说明
本实例所要完成的效果是当鼠标移动到文字上时,就会弹出一个漂亮的菜单,如图 17-1
和图 17-2 所示。
创作思想
本实例首先在网页中输入一行文字,并对文字做一个特殊的超链接,然后利用
Dreamweaver MX 2004 自带的行为制作弹出菜单。
操作步骤
(1)输入文字并设置超链接。在网页中输入文字,因为单独的文本文字是无法添加行为的,按照 Dreamweaver 中的约定,将文字的超链接设置为“ javascript:;”才能够添加行为。所以将文字的超链接设为“ javascript:;”,并执行【显示弹出式菜单】行为,如图 17-3 所示。
(2)设置菜单项和子菜单项,并为菜单设置超链接,然后安排好各个菜单的次序,如图 17-4 所示。
(3)设置页面元素。将菜单设置为垂直菜单,并分别设置菜单的字体、字号、对齐方式、一般状态和鼠标滑过时的状态,如图 17-5 所示。
(4)设置【高级】标签。在【高级】标签选项中设置菜单的延迟时间,以及是否显示菜单边框。然后设置边框的宽度、颜色、阴影、高亮,如图 17-6 所示。
注意:【菜单延迟】中时间的单位是毫秒(ms),1000 毫秒等于 1 秒,在设置时
注意换算。
(5)设置的 x 轴和 y 轴参数。在【位置】标签选项中设置弹出菜单的 x 轴和 y 轴参数,这两个参数表示弹出菜单左上角到网页左上角的距离,如图 17-7 所示。
(6)保存网页文件,然后在浏览器中打开该网页,将鼠标光标移动到文字上方时即可看到有菜单弹出,本实例操作完毕。通过 Dreamweaver,可以快速制作出以往只能用复杂代码才能实现的弹出菜单,这样可以实现复杂菜单的弹出和收缩,方便使用又能让页面美
观、整洁。
滑动折叠菜单
在网页展示平面有限的情况下,折叠菜单是一个很不错的选择。这种菜单在一般情况下是折叠起来的,只有当浏览者将鼠标移动到菜单上时,菜单才会滑动展开。
效果说明
当鼠标不在菜单上时,菜单处于折叠状态,看起来是很普通的一个菜单栏,如图 18-1 所示。当鼠标移动到菜单栏上时,该菜单的子菜单就会慢慢滑动展开,如图 18-2 所示。
创作思想
先在一个图层中输入文字,形成菜单折叠时的状态,再使用图层展开时间轴动画来实现
滑动展开菜单的效果。
操作步骤
(1)新建文件并添加层。新建一个网页文件,在网页中添加一个父层(第一级的层)和一个子层(第二级的层),分别设置两个图层的大小和位置,如图 18-3 所示。
(2)设置表格和文字。在 layer1 层中插入表格,设置好表格的高度和背景,然后在表格内输入文字并设置好文字的格式,如图 18-4 所示。
3)设置 layer2 层。设置 layer2 层的背景颜色,然后在其上输入文本并设置超链接,再将 layer2 层添加到时间轴上,以后便可对 layer2 层进行时间轴动画操作,如图 18-5 所
示。
(4)新建一个时间轴 Timeline2,然后将 layer2 层添加到新的时间轴上,如图 18-6
所示。
提示:不同的时间轴可以实现对不同对象的控制,也可以实现多个不同动画。
(5)设置时间轴。分别对时间轴 Timeline1 的第 1 帧和时间轴 Timeline2 的第 15 帧进行设置(这里以第 15 帧作为动画的最后一帧),如图 18-7 所示。
提示:只需要改变时间轴的关键帧,就可以直接生成动画效果,本例将时间轴 Timeline1 第 1 帧中 Layer2 层的高设置为 0px,这样就生成了层慢慢滑出的动画效果。
(6)添加行为。选择表格中的第一个单元格,然后为单元格添加 onMouseOver(鼠标移到单元格上面时)时的行为到播放时间轴 Timeline1,如图 18-8 所示。
(7)继续添加行为。再为该单元格添加 4 个 onMouseOut(鼠标移开时)行为,参数设
置如图 18-9 所示。
(8)添加 2 个行为。选择 layer2 层,并分别添加两个 onMouseOver 和两个
onMouseOut,具体操作如图 18-10 所示。
(9)保存网页文件,然后在 IE 中进行预览,本实例操作完毕。通过时间轴上不同对象在不同时间的状态,再结合时间轴的播放、停止和跳转是 Dreamweaver 中实现动画效果的最基本方法,读者可以充分利用这些功能来实现更精彩的效果。
全景图浏览效果
是否有见过游戏中的全景图效果,充满动画与真实感,让人难以忘怀。在本例中就介绍如何
制作这样的网页。
效果说明
建立文件,选择一张全景图素材,然后插入少量的代码就可以实现全景图浏览效果,如图 43-1 所示。实际效果请浏览随书光盘中《源文件》目录下的相关文件。
创作思想
打开 Dreamweaver MX 2004 软件新建页面并插入表格,在表格的 HTML 代码中插入
操作步骤
(1)新建一个基本的 html 文件,然后保存页面为“ 43.htm ”。
(2)插入表格。要使全景图在指定的区域中走动,必须先插入表格,如图 43-2 所
示。
提示:图 43-2 中的第五步操作必须将高度设置得与图片一样高。
(3)插入标签。然后在工具栏中单击【标签选择器】图标,打开【标签选择器】对话框,在该对话框中设置参数,插入
提示:标签选择器对话框中汇集了一些常用的标签,如 HTML 标签、CFML 标签、ASP.NET 标签等,通过双击相应的代码标签,就可以很轻松地在代码视图中插入代码。
(4)设置参数。接着设置
(5)再接下来需要在代码视图里手动添加代码。回到代码面板,将光标切换到
for(t=1;t<=1000;t++)document.write(“”)
(读者可打开【光盘】|【源文件】|【实例 43 】|【 43.1.txt 】文件,直接复制
代码)
提示:
中第三步操作里的 HTML 代码进行调整。
(6)保存文件,完成操作。
全景图合适用于厂房、展厅等大型演示上,因为单一镜头图片不能让用户看到全景,通过全景图则能够让需要展示的大型场景一览无余。
随机播放背景音乐的网页
相信很多人在打开娱乐网站或个人主页时,经常都会听到一些音乐。本例将介绍如何实现在网页上随机播放背景音乐。
效果说明
建立文件,循环插入要播放的音乐,便可制作出动感的背景音乐,而且是随机的。实际效果请浏览随书光盘中【源文件】下的对应文件。
创作思想
打开 Dreamweaver MX 2004 软件新建页面,再选择【行为】面板下的【 + 】选项插播音乐,设置参数。然后重复此操作 4 次,就可以随机播放背景音乐。
操作步骤
(1)打开 Dreamweaver MX 2004 软件新建文件,并保存页面。
(2)选择好“标签”页,在“行为”面板中插入要播放的音乐文件,如图 55-1 所
示。
(3)接着选择插入的声音文件,打开参数窗口,设置其参数,如图 55-2 所示。
(4)重复执行图 55-1 和图 55-2 所示的操作 4 次,这样就添加了 4 种音乐,使得程序可以随机在这四种音乐中挑选其中一首来播放。因此,图 55-1 中所示的第四步操作
要选择不同的音乐文件。
(5)保存文件,完成操作。适当放置轻松的音乐背景,可以让用户感觉更轻松、愉
快。
网页滚动布告栏
如果想要在网页里显示最新信息、新闻、通知、布告等较长的文字信息,而又不想占用太多的网页空间,可以使用滚动报告栏。
滚动报告栏通常是通过利用 Javascript 技术控制网页中的层的滚动来实现的,然而手工编写 Javascript 代码进行制作肯定是比较复杂、困难的事情。使用 Dreamweaver 为用户提供的【 ScrollableArea 】插件可以快速便捷地制作出滚动报告栏。
效果说明
用户可以通过滚动栏上的【向上滚】和【向下滚】两个按钮控制报告栏文字的滚动速度和方向。实际效果请浏览随书光盘中【源文件】下的对应文件。
创作思想
在随书光盘中找到“ ScrollableArea ”插件,然后运行 Macromedia 的插件管理器安装插件。接着打开 Dreamweaver MX 2004, 在【命令】菜单中单击【 dHTML AP Scrollable Area 】选项,就可以开始设计滚动布告栏了。
操作步骤
(1)安装插件。首先在随书光盘中的【源文件】 / 【实例 56 】目录里面找到 Dreamweaver 的“ ScrollableArea.mxp ”插件,接着运行 Macromedia 的插件管理器“ Extension Manager.exe ”,Macromedia 的插件管理器是随 Dreamweaver 自动安装的,通常和 Dreamweaver 安装在同一目录下面的“ Extension Manager ”文件夹里面。
(2)选择插件管理器菜单栏上的【文件】菜单进行操作,如图 56-1 所示。
提示:如果插件文件已经和 Macromedia 的插件管理器建立了文件关连,那么直接双击插件文件就可以自动打开 Macromedia 的插件管理器安装插件了。
(3)单击【安装】按钮后会弹出一个安装协议窗口。单击安装协议窗口上面的【接
受】按钮完成安装。
(4)设置 滚动布告栏。安装完插件后运行 Dreamweaver MX 2004,打开或者新建一个 web 文档,进行如图 56-2、图 56-3 和图 56-4 所示的操作。
(5)经过上面的操作,基本完成了滚动布告栏的制作。在 Dreamweaver 中执行【文件】 / 【在浏览器中预览】 / 【 IE 浏览器】命令或者单击键盘上的 F12 键预览网页时,可能会出现不正常显示的情况,这是由于 ScrollableArea 产生的代码中没有设置图层位置的单位。执行如图 56-5 和图 56-6 所示的操作,即可解决这个问题。
(6)执行完如图 56-6 所示的操作后,在图 56-5 中所示的第 3 步再分别选择【# divDownControl 】、【# divContainer 】和【# divContent 】选项,然后再分别执行如图 56-6 所示的操作。给 4 种样式分别加上【像素】单位后测试网页,就可以看到如图
56-7 所示的滚动公告栏了。
(7)将鼠标光标分别移动到【 Scroll up 】和【 Scroll down 】上面,就可以看
到中间的文字上下滚动了。
Dreamweaver 的插件种类繁多,功能强大。善于发现和使用插件,可以制作出一些
Dreamweaver 本身望尘莫及的效果。
首先打开dreamweaver,我们可以在新建中找到“管理站点”项,或者我们可以在菜单栏中找到“站点”——“管理站点”,如图1、图2所示:
图1
图2
点击“管理站点”选项后,可以打开“站点设置对象”窗口,在“站点名称”喝“本地站点文件夹”中填写站点名称及选择你所要打开站点的文件夹,如图3所示。修改完成后就可以点击“保持”按钮。
图3
(一) HSB模型
基于人类对色彩的感觉,HSB 模型描述颜色的三个基本特征:
1、色相H,在 0 到 360 度的标准色轮上,色相是按位置度量的。在通常的使用中,色相是由颜色名称标识的,比如红、橙或绿色。
2、饱和度S,是指颜色的强度或纯度。饱和度表示色相中彩色成分所占的比例,用从 0%(灰色)到 100%(完全饱和)的百分比来度量。在标准色轮上,从中心向边缘饱和度是递增的。
3、亮度B,是颜色的相对明暗程度,通常用从 0%(黑)到 100%(白)的百分比来度量。
(二) RGB模型
绝大部分的可见光谱可以用红、绿和蓝 (RGB) 三色光按不同比例和强度的混合来表示。在颜色重叠的位置,产生青色、品红和黄色。因为 RGB 颜色合成产生白色,所以RGB模型为加色模型,用于光照、视频和显示器。例如,显示器通过红、绿和蓝荧光粉发射光线产生彩色。
(三) Lab模型
Lab 色彩模型是在 1931 年国际照明委员会(CIE)制定的颜色度量国际标准的基础上建立的。1976 年,这种模型被重新修订并命名为 CIE Lab。
Lab颜色设计为与设备无关;不管使用什么设备(如显示器、打印机、计算机或扫描仪)创建或输出图象,这种颜色模型产生的颜色都保持一致。
Lab颜色由心理明度分量 (L) 和两个色度分量组成;这两个分量即 a 分量(从绿到红)和 b 分量(从蓝到黄)。
(四) CMYK模型
CMYK 模型以打印在纸张上油墨的光线吸收特性为基础,当白光照射到半透明油墨上时,部分光谱被吸收,部分被反射回眼睛。
理论上,纯青色 (C)、品红 (M) 和黄色 (Y) 色素能够合成吸收所有颜色并产生黑色。由于这个原因,CMYK模型叫作减色模型。因为所有打印油墨都会包含一些杂质,这三种油墨实际上产生一种土灰色,必须与黑色 (K) 油墨混合才能产生真正的黑色(使用 K 或Bk而不是 B 是为了避免与蓝色混淆)。
一、Dreamweaver设置容器的文本行为
1. 打开文档,选择一个页面元素。
2. 给选取的元素添加ID,在属性面板中点击ID文本框,输入ID号。或者在源代码中直接添加ID号。
3. 打开行为面板。
4. 点击“添加行为(+)”按钮,在弹出的下拉菜单中选择“设置文本”项,在子菜单中选择“设置容器的文本”命令。如下图所示:
5. 打开“设置容器的文本”对话框,如下图所示:
容器:选择一个目标元素。
新建 HTML:输入要设置的文本。
提示:也可以在“新建 HTML”框中输入任何JavaScript函数、属性、变量或者表达式。如果输入JavaScript表达式,请将其放在大括号({})中。如果要显示大括号,请在前面加上反斜杠转义字符({ 和 })。
(1)使用JavaScript表达式示例一:
这个页面的URL地址是:{window.location}
将代码输入到“新建 HTML”文本框中即可。
(2)使用JavaScript表达式示例二:
今天是:{new Date}
将代码输入到“新建 HTML”文本框中即可。
6. 单击“确定”按钮。
7. 查看附加的事件是否是需要的事件。如果不是需要的事件,可以更改事件。此例中将onmouseover事件修改为onmousemove事件。
在dreamweaver中插入占位符后,我们可以用鼠标选中占位符,这时在软件下方出现占位符的属性面板,此时我们就可以在属性中可以对占位符的颜色、大小、链接等进行设置。
★ WPS文字中如何设置页码
★ 如何为Word文档设置文字水印
★ Dreamweaver创建文件夹
★ 设置Excel单元格内文字的方向
★ Windows7登录界面文字和按钮样式应如何更换?
★ 英语教案样式
★ 再审申请书样式
★ 在Word 文档中设置框文字环绕方式
★ Word入门动画教程43:拷贝文字样式保持不
1、站点的导入方法
方法一:用“站点 / 管理站点 / 导入”命令导入站点的ste文件
方法二:用“站点 / 新建站点 / 高级” 打开相应站点文件夹
2、网页更名的方法:右击网页文件名。选择“编辑/重命名”命令(注意:先更名后打开)
3、设置网页标题:打开网页后,在标题栏输入网页标题
4、网页背景颜色、文字颜色、背景图片和链接颜色:
“修改 / 页面属性 / 外观”和 “修改 / 页面属性 / 链接”
5、网页背景图片固定的方法:
在标签栏中单击“
”标签,在标签面板属性的“未分类”中设置 bgproperties属性为 fixed6、网页背景音乐:插入/标签/ 标记语言标签/ HTML标签/页元素/ bgsound7、插入图片:插入/图像8、建立Flash按钮:插入/媒体/Flash按钮
9、建立Flash文本:插入/媒体/Flash文本
10插入WMV视频:插入/媒体/插件
11插入水平线及设置水平线属性: 插入/HTML/水平线
12、设置鼠标经过时的图像效果:插入/图像对象/鼠标经过图像
13、插入Flash动画:插入/媒体/Flash14、设置动画背景透明的方法
• 单击 Flash属性面板上的“参数”按钮,出现“参数”对话框,添加参数:wmode、相应的值设置为:transparent14、插入字幕
(1)插入 / 标签 / 标记语言标签 /HTML标签/页元素/marquee,单击插入按钮后关闭,在代码窗口
(2)返回设计视图,选中字幕文字,在属性面板设置字体和颜色
(3)在标签栏中单击“< marquee >”标签,在标签属性面板中设置方向(direction)、背景颜色(bgcolor)表现方式(behavior)延时(scrolldelay)
15、图片作为字幕的方法:见课堂讲解实例
16、动画作为字幕的方法:见课堂讲解实例
17、设置逐张播放图像:
(1)插入/媒体/Applet”,选中XXXXXX.class(具体根据考试指定的文件)
(2)选中插入的Applet元素,在“属性”面板设置宽度和高度
(3)单击“属性”面板“参数”按钮,在对话框中添加image1、image2。。若干参数,值分别为相应的图片文件名。
Dreamweaver操作小结建立各种超级链接
18、在文字或图像对象上建立超级链接
(1)选中文字或图像;(2)在属性面板的链接栏内选择(或输入)相应的网页或URL地址 • 注意:如果是Email链接,则需在Email地址前面加上 Mailto:
19、建立图像的热点链接
(1)选中图像,选择属性面板中相应的热点工具
(2)在图像中拖曳鼠标产生热点区域
(3)在热点属性面板的“链接”栏内选择(输入)相应网页或URL地址
19、设置锚点链接
(1)先建立锚点 插入/命名锚记,保存网页,然后建立链接,注意“#”符号
在建立各种链接时注意链接目标(_Blank)及建立空链接的方法(#)
Dreamweaver操作小结有关表格的操作
20、插入表格以及表格的边框线、宽高、间距等属性
(1)插入/表格;(2)设置行列数,设置宽度(注意有像素和百分比两种单位),设置边框粗细和间距大小
21、选中表格、选中行,选中列,选中单元格的方法,先把光标放在表格中相应位置
(1)在标签栏中单击“
”,选中当前单元格 22、插入表格的行、列的方法: (1)插入/表格对象/在上面插入行(2)插入/表格对象/在下面插入行 (3)插入/表格对象/在左面插入列(4)插入/表格对象/在右面插入列 23、表格单元格的合并和拆分:(1)合并:修改/表格/合并单元格 2)拆分:修改/表格/拆分单元格 24、表格的背景图片;(1)选中表格;(2)在表格属性栏中选择指定图片 Dreamweaver操作小结插入表单对象 25、插入表单对象 插入/表单/文本域(注意类别:密码) 插入/表单/单选按钮 插入/表单/列表/菜单 插入/表单/复选框 插入/表单/文本区域 26、表单文本区域的背景颜色设置 (1)选中文本区域,打开“CSS样式”面板,单击“新建CSS规则”按钮,选择“标签” (2)选中“textarea”标签 (3)“定义在”选择“仅对该文档” (4)在“textarea的CSS规则定义”对话框“背景”分类中设置“背景颜色”为指定颜色。 27、表单对象的属性设置 选中表单对象,即可在属性面板中进行参数设置,注意相关的单选按钮必须同名 Dreamweaver操作小结框架网页 27、建立框架结构的网页(框架集) (1)选择“文件/新建/常规/框架集”,在“框架集”列表中选择指定类型,单击 “创建”按钮。 (2)选择“文件/框架集另存为”命令,按要求输入网页文件名 (3)选择“窗口/框架”命令,打开框架面板 (4)按要求设置各框高度、宽度及是否显示边框 28、建立框架内各部分网页(框架)的两种情况: 新建网页:将光标放在框架的相应区域内,“文件/保存框架”命令,按要求保存,然后再对该网页进行编辑 设置初始网页:在框架面板中选定相应区域,在属性面板中的“源”栏中选择相应的网页。 29、建立嵌入式框架 (1)插入/标签/HTML标签/iFrame (2)在标签编辑器中设置“源”为指定网页 (3)名称栏内输入:相应名称(例如yh),设置宽度和高度 (4)设置某对象超级链接到指定网页,目标为相应名称(例如yh) Dreamweaver操作小结层的操作 30、插入层 方法1:使用菜单“插入/布局对象/层” 方法2:使用“布局”工具栏“绘制层”按钮 31、设置层属性:单击层边框,在层属性面板中设置层编号,左、上、宽、高参数 32、设置层的显示/隐藏以及层位置 方法1:通过层属性设置可见性和z轴数值 方法2:用“窗口/层”命令打开层面板,设置可见性和z轴数值 注意:z轴数字小的层在下面。 Dreamweaver操作小结(十)行为 33、行为: (1)选中相应元素(文本或所在单元格,若是整页,则单击body)(非常重要)。 (2)在行为面板中单击“+”按钮,在出现的下拉菜单中选择相应的行为,如打开浏览器窗口、隐藏-显示层、弹出式菜单(注意)、弹出信息等。 (3)按要求选择行为,如“要显示的URL”、“显示”、“隐藏”等 (4)在“行为”面板中单击“onFocus”的下拉列表,选择相应的鼠标动作,如onClick、OnMouseOver、OnMouseOut等。 (5)注意一个对象要添加多个行为时一定要选中该对象或该对象所在单元格。 34、库的应用(1) 方法1 :(将网页中现有的元素放到库项目中): (11)打开含有相应内容的网页 (12)选择“窗口/资源”命令,打开“资源”面板,单击“库”按钮打开库类别。 (13)选中网页中相应内容,单击“库”类别底部的“新建库项目”按钮,如果出现警告提示框,单击“确定”按钮即可。 (14)在“名称”列表中输入相应的库名,按回车键。 (15)打开其他要应用库的网页,将库项目从“资源”面板直接拖曳到该网页相应位置。 (16)保存网页。 方法2:(新建一个库项目) (1)选择“窗口/资源”命令,打开“资源”面板,单击“库”按钮打开库类别。 (2)单击“库”类别底部的“新建库项目”按钮,如果出现警告提示框,单击“确定”按钮即可 (3)在“名称”列表中输入相应的库名,按回车键。 (4)单击“库”类别底部的“编辑”按钮,进入库编辑状态 (5)编辑相应的内容后选择“文件/保存文件”,关闭lbi文件 (6)打开其他要应用库的网页,将库项目从“资源”面板直接拖曳到该网页相应位置。 (7)保存网页。 Dreamweaver操作小结模板的运用 35、建立模板 (1)打开要作为模板的网页 (2)选择“文件/另存为模板”命令,输入相应模板文件名 36、编辑模板 (1)把插入点放在模板的相应位置,选择“插入/模板对象/可编辑区域”命令,添加可编辑区域。 (2)选择“文件/保存”命令保存模板文件 36、应用模板 (1)选择“新建文件”命令,建立一个新网页,改名后打开该网页 (2)选择“修改/模板/套用模板到页”命令,在 “选择模板”对话框中选择指定的模板文件,单击“选定”按钮。 (3)在“不一致的区域名称”对话框中选中Document body (4)在“将内容移到新区域”栏中选择设定的区域EditRegion。 (5)将插入点放在EditRegion区域,按要求编辑 (6)保存网页。 37、插入Java代码 (1)双击打开指定的代码文本文件,全选并复制,关闭文本文件 (2)打开代码窗口,将其贴在 之后(注意不能贴错)38、插入特殊字符:插入/HTML/特殊字符 Dreamweaver操作小结导航条 38、插入导航条 方法: (1)选择“插入/图像对象/导航条”命令 (2)选择导航条的插入方向“垂直”或“水平” (3)在“插入导航条”对话框中输入“项目名称”(不能是中文名称) (4)按要求选择“状态图像”、“鼠标经过图像”、“按下图像”及“按下时鼠标经过图像” (5)按要求在“按下时,前往的URL”栏中选择或输入相应链接地址 39、用CSS样式定义超级链接文字颜色 (1)在“CSS样式”面板中,单击 “新建CSS规则”按钮,出现“新建CSS规则”对话框。 (2)选择“高级”选择器类型。 (3)在“选择器”下拉列表中选择“a:hover”,(4)“定义在”选择“仅对该文档”,单击“确定”按钮后,(5)在“a:hover的CSS规则定义”对话框,在“类型”分类中选择“无”修饰、“颜色”设置为指定颜色。 • 同上,设置“a:link”标签:“定义在”选“仅对该文档”,“类型”分类中选择“无”修饰、“颜色”设置为指定颜色。 • 同上,设置“a:visited”标签:“定义在”选“仅对该文档”,“类型”分类中选择“无”修饰、“颜色”设置为指定颜色。 • 同上,设置“a:active”标签:“定义在”选“仅对该文档”,“类型”分类中选择“无”修饰、“颜色”设置为指定颜色。 Dreamweaver操作小结 其他 40、增加网页字体的方法; 41、导入素材的方法 43、新建网页的问题; 认识Dreamweaver教案 篇8若要创建网站相册,请执行以下操作: 1.在 Dreamweaver 中,选择“命令”>“创建网站相册”。 2.在“相册标题”文本框中输入一个标题。该标题将显如今包含缩略图地页面地顶部地灰色矩形中。 假如需要,能够在“副标信息”和“其它信息”文本框中输入最多两行附加文本,该文本将直接在标题下显现。 注意:创建网站相册前 确保你的电脑上安装了 fireworks,命令——创建网络相册,会自动调用fireworks,,自动生成网页 3.单击“源图象文件夹”文本框旁地“浏览”按钮,选择包含源图象地文件夹。然后单击“目标文件夹”文本框旁地“浏览”按钮,选择(或创建)一个目标文件夹,用以放置一切导出地图象和 HTML 文件。 目标文件夹不应当已包含相册 - 假如已包含相册,并且假如任何新图象与先前使用地图象同名,则能够会覆盖现有地缩略图和图象文件。 4.指定缩略图图象地显现选项: o 从“缩略图大小”弹出菜单中选择缩略图图象地大小。图象将按比例缩放,以创建适宜具有指定象素尺寸地方框地缩略图。 o 若要在相应地缩略图下显现每个原始图象地文件名,请选择“显现文件名”。 o 输入显现缩略图地表地列数。 5.从“缩略图格式”弹出菜单中选择缩略图图象地格式: GIF WebSnap 128 创建 GIF 缩略图,这些缩略图使用包含多达 128 色地 Web 顺应性调色板。 GIF WebSnap 256 创建 GIF 缩略图,这些缩略图使用包含多达 256 色地 Web 顺应性调色板。 JPEG - 品质较高创建品质较高且文件大小较大地 JPEG 缩略图。JPEG - 文件较小创建品质较低且文件大小较小地 JPEG 缩略图。 6.从“相片格式”弹出菜单中选择大尺寸图象地格式。对于每个原始图象,将创建一个具有指定格式地大尺寸图象。您为大尺寸图象指定地格式能够不同于为缩略图指定地格式。 留神 因为 GIF 和 JPEG 之外地原始文件格式能够无法在一切浏览器中正确显现,所以“创建网站相册”命令不允许您将原始图象文件用作大尺寸图象。请留神,假如原始图象是 JPEG 文件,则所生成地大尺寸图象地文件大小能够比原始文件大(或许其品质比原始文件低)。 7.选择大尺寸图象地缩放百分比。 假如将“缩放”设置为 100%,将创建与原始图象等大地大尺寸图象。请留神,缩放百分比将应用于一切图象;假如原始图象地大小不一样,那么按同一百分比缩放就能够不会产生所需地效果。 8.选择“为每张相片树立导览页面”,为每个源图象创建一个 Web 页,该 Web 页包含标为“后退”、“主页”、“前进”地导航链接。 假如选择此选项,缩略图会链接到导航页。假如不选择此选项,缩略图链接将直接链接到大尺寸图象。 9.单击“肯定”以创建网站相册地 HTML 和图象文件。Fireworks 启动(假如它尚未运行)并创建缩略图和大尺寸图象。假如所包含地图象文件数目较多,这能够会需要几分钟地时间。当处理完成后,Dreamweaver 将再次处于活动状态并创建包含缩略图地页。 10.当出现指示“相册曾经树立”地对话框时,单击“肯定”。 |