网页制作基本教学教程.doc

《网页制作基本教学教程.doc》由会员分享，可在线阅读，更多相关《网页制作基本教学教程.doc（24页珍藏版）》请在得力文库 - 分享文档赚钱的网站上搜索。

1、,网页制作基础教程一、什么是HTMLHTML（超文本标记语言）是网页中使用的语言，他能被网页浏览器（IE或Netscape）解释，从而显示出丰富多彩的信息（图片、文字、声音、影象、动画等）。制作网页前首先要弄懂什么是HTML。在IE中点击查看源文档，就能看到该网页的HTML代码。下面是个网页文档（model.htm）的HTML代码：这里是标题第一段文字。第二段文字。【操作】请在记事本中输入以上代码，命名为test1.htm，存于D盘，然后双击打开看看。标记一般是成对出现的，#FFFFFF表示使用的颜色是白色。.之间是该网页的标题charset=gb2312表示语言字符集信息是中文简体，如big

2、5则是中文繁体。.之间是网页的正文内容表示网页的背景色是白色，默认的文字颜色是白色。.之间是h1号标题字.之间是h2号标题字.之间的文字为红色HTML是一套国际标准，其标记有几百种，您并无需全部了解他们，只要记住其中常用的十几种，就能够做出很漂亮的网页来。常用的标记举例：标记名称标记举例解释链接 . URL：链接的地址，如： 标尺线划一条横线 换行人工换行 链入图象如：images/face.gif 文字的对齐Hello元素中间对齐 Hello元素右对齐 Hello元素左对齐 表格.定义表格 定义表行 定义表头 定义表元(表格的具体数据) 【操作】复制一个jpg格式的图片文档，取名为pic，保

3、存到D盘，在记事本中输入下列语句，命名为test2.htm，存于D盘。这里是标题第二个网页链接到校园网链接到我的图片链接到test1下面是个带边框的表格FoodDrinkSweetABC二、准备工作 制作网页前重要的工作是规划好网页的架构，一般开设images、common、temp三个子目录，根据需要再开设media子目录，images目 录中放不同栏目的页面都要用到的公共图片，例如网站的标志、banner条、菜单、按钮等；common子目录中放css、js、php、include 等公共文档；temp子目录放各种临时备用的文档；media子目录中放flash、avi、quick time等

4、多媒体文档。在根目录中原则上按照首页的栏目结构，给每一个栏目开设一个目录，根据需要在每一个栏目的目录中开设一个images和media的子目录用以放置此栏目专有的图片和多媒体文档，假如这个栏目的内容特别多，又分出很多下级栏目，能够相应的再开设其他目录。除非有特别情况，目录、文档的名称全部用小写英文字母、数字、下划线的组合，其中不得包含汉字、空格和特别字符；目录的命名请尽量以英文为指导，不到万不得已不要以拼音作为目录名称，经验证实，用拼音命名的目录往往一个月后连自己都看不懂。网站的首页文档一般取名：index.htm放置在页面顶部的广告、装饰图案等长方形的图片取名：banner标志性的图片取名：

5、logo在页面上位置不固定并且带有链接的小图片取名：button在页面上某一个位置连续出现，性质相同的链接栏目的图片取名：menu装饰用的照片取名：pic不带链接表示标题的图片取名：title三、制作软件介绍下面介绍3个做网页的辅助软件，有了软件并不一定能够把网页做好，关键还得看懂HTML代码具体表示什么意思。软件名称描述长处缺点如何获取Microsoft FrontPage微软Office套件之一，网页制作解决方案，适合初、中级用户使用和Word软件的良好兼容，现成的各种模板操作、修改繁琐，有冗余代码Office套件里带有Macromedia DreamweaverMacromedia公司的

6、网页制作3剑客之一（另外2个是Flash、Firework），适合专业用户使用操作灵活，效率高，网页可读性好，解决IE和Netscape的兼容性几乎没有需要另外购买或下载东方网页王5.0企业版国内交大铭泰软件公司的网页制作解决方案，适合初级用户使用操作简便，形象直观，模板丰富扩展度不够，制作不灵活，修改繁琐需要另外购买或下载四、Dreamweaver初步（见演示）1工具栏2属性栏3定义本地站点4编辑站点主页5定义背景颜色和图象6定义页面标题7创建链接8编辑表格五、网页设计配色出色十例（1） 这是个大型的NBA网站。通常我们经常看到的此类网站以白色为背景，但是这个网站却用灰黑色RGB为（48，4

7、8，48/#333333）（以下颜色都用 RGB表示），文章标题用色为RGB为（203，201，153/#CCCC99），菜单使用的RGB为（112，119，112/#707770）。这 样的配色能够显示独特的个性，又不失大型网站的风采。（2）下面是个娱乐类的综合性网站UGO，他的配色方案是背景色为黑色RGB为（0，0，0）中嵌套RGB（0，0，82），字体白色 RGB（255,255,255）,菜单为RGB（77,114,159）。这样的虽以黑蓝为主色调，但是配以漂亮的图片，给人的感觉是生机盎然，充满了 互动色彩和青春气息。（3） 下面的这个网站是大名鼎鼎的微软公司网站，微软不但软件做的好，

8、连网页制作也是世界一流。他的每一个网页都是制作的样板。从网页我们就能够看出微软公司的 风格、作风，连同雄厚的实力。背景颜色使用蓝色RGB为（0，151，254），菜单为黑色RGB（0，0，11），菜单为灰色 RGB（200，200，200），字体为黑色RGB（0，0，0）。（4） 现在介绍的网站相对简单，但是她的用色也别具匠心，现在我们来看一看，整体上使用的是白色RGB（255，255，255），辅助色为 RGB（79，88，95），菜单色为RGB（48，64，64）和RGB（0，81，111）字体使用的是RGB（83，86，91）。虽然简单，但颜 色搭配很的科学合理。（5） 下面的网站采用黄

9、色调为主，很体现公司的个性，现在我们就来看一看她的颜色搭配。主色调为黄色RGB为（255，199，48/#FFC730），辅助色 调为RGB（49，102，46）字体为棕色RGB（153，103，0），中间再配以抽象的图片，显得个性十足但又不单调。（6） 橘红色假如运用得当的话是一种很使用于网页上的颜色。下面的这个网站就是个很著名的例子。他的主色调为RGB（255，151，0）辅助色调为 RGB（255，103，4），菜单RGB为（252，200，0）。字体使用黑色RGB为（0，0，0）。此种配色显得主人较为前卫，色彩热烈，给人的 震慑力较强。（7） 鲜红色也是一种震撼感很强的颜色，假如搭配不

10、当，也可能使网站没有风格和特点。下面的这个网站就是使用红色比较好的网站。我们来看看他的颜色搭配。他使用 的主色调是RGB（200，9，0），配以抽象的图像，文字使用的是RGB（213，229，167）显得美观而不失独特，大气而不逼人。（8） 下面介绍的这种色调是我们制作网页的时候不会经常用到的颜色，假如使用到您的网页中，肯定会给人耳目一新的感觉。他的主色调为 RGB（144，151，97）辅助色调为RGB（173，168，112）边饰为黑色RGB（0，0，0）字体为黑色RGB（0，0，0）。这样的搭配 显得风格独特，颜色和谐而庄重。（9） 下面的设计更加的简单化，但是颜色的使用使网页并不呆板，

11、反而让人感觉到一股浓浓的生活和家庭气氛，使人置身于美丽和爱中。他的主体是由两种颜色构成，分 别是RGB（239，200，161）和RGB（201，254，200）。如此简单，但是却栩栩如生，跃然网上。（10） 下面举出这个例子是想证实一个道理只要您有足够的想象力，您就能够设计出漂亮的网页。现在在网上很流行一句话就是网页的搭配不要超过四种主要颜色，否 则就有杂乱之感。下面的这个网站远远的超过了三种颜色，但是她并不失美丽。因此重要的还是色彩的驾驭能力。下面这个例子的菜单就使用了7种颜色，但是我们 看到的网页并不杂乱，相反感觉作者很有创意。十一、制作滚动公告牌1、 在页面上插入一个层，然后为层配置一

12、个背景，作为公告版的框架。2、 然后在创建的层中插入嵌套层，将嵌套层移动到父层的下方。3、 在嵌套层中输入文本，并将其居中排列。4、 打开时间轴面板，将子层作为对象添加到面板中。5、 为子层创建一个向上移动的路径，将其移动到父层的上方。6、 拖动最后一关键帧，增长动画时间，然后勾选“自动播放”和“循环”两项。7、 选定父层，在其属性面板中将“溢出”属性配置为“hidden”。十二、在页面中运用flash动画1、 点击插入中的Flash按钮，即可为页面插入一个动画。也能够选菜单插入/媒体/Flash来完成这一步。2、 选中已插入的动画，看属性面板。这里能够配置他的宽、高，也能够通过拖动来改变大小

13、。3、 能够在这里点击“播放”来预览动画。十三、让插入的flash动画变透明1、 当网页上已有背景，或是想要在一张图片上再插入flash动画，而flash动画本身也有背景色，所以会影响美观，这时我们要把他做成透明动画。2、 如在页面上插入一张图像。3、 在图像上插入一个层，在层中插入好所需要的flash动画。4、 选中flash动画，在属性面板中点击“参数”按钮。5、 在“参数”的左面一格输入“wmode”。在右面“值”一格输入“transparent”。十四、在页面中播放声音1、 在完成全页面以后，假如要为该页添加背景音乐，注意背景音乐一般是*.midi文档，这样的声音文档十分小，易于快速下

14、载，其他格式不适合作为背景音乐。 2、 在页面中任何表格之外，（注意此时编辑窗口左下方的标签选择栏中仅显示这一项，或是在左下角点一下，这 样才能确保这个行为是添加在整个页面上的）。点击行为窗口上的“ ”按钮，（或用菜单 窗口/行为，打开行为窗口。）3、 从弹出菜单中选择“播放声音”。打开一个对话框。4、 在这个对话框里用“浏览”选择要播放的声音，并确定。5、 这时行为面板上自动显示了事件为onload，动作为播放声音。点击这一行，中间出现一个按钮。点击按钮，能够配置这个声音在什么事件下播放。能够选择“显示事件”/“IE5.0。6、 我们常用的如Onload（当页面载入时）、OnClick（单击

15、鼠标）、OnMouseOver（鼠标移到对象上）、OnUnload(当关闭页面时)等。7、 该行为也能够配置在图片上、文字链接上。在文字链接上播放声音之前，先为文字添加一个空链接，即选中文字，在链接一格里输入一个“#”符号。十五、弹出窗口1、首先制作一个准备在小窗口中显示的页面（比如a.htm）,由于这个弹出窗口不能太大，所以内容要少一些。2、打开一个制作好的页面，把光标移到页面中任何我表格以外，点击行为窗口上的“ ”按钮，从弹出菜单中选择“打开浏览器窗口”一项。3、在对话框中里输入相应的配置。要显示的URL即a.htm，窗口宽度和高度自己定，单位为像素。属性中的各项参数需要就打勾。4、 配置

16、完毕后，点“确定”。此时行为窗口中将显示打开浏览窗口这个行为，触发条件为Onload，假如不是要这项，就自己配置。5、 该行为也能够配置在图片上、文字链接上。6、 能够用这个方法来表示对浏览者的打开时的欢迎、网站公告、离开时的告别语等。十六、控制状态栏信息1、 打开页面，选中一张图片。2、 点击行为窗口上的“ ”号按钮，选择配置文本/配置状态条文本。3、 在对话框里的“消息”一栏里，输入需要显示的话，如对这张图片的介绍。4、 能够配置行为的触发条件为OnMouseOver（鼠标移到对象上），这样当鼠标经过这张图片的时候，状态栏将出现相关的信息。5、 假如需要鼠标在移开后，这个信息消失，那么再次

17、使用这个行为，在“消息”一栏里什么都不写，然后把触发条件改为OnMouseOut（鼠标移开）。6、 同样能够在一段文字上配置该行为。或是配置在整个页面上也能够。十七、弹出信息1、 打开一个制作好的页面，点左下角项。点击行为窗口上的“ ”按钮，从弹出菜单中选择“弹出信息”一项。2、 在配置窗口中“消息”一栏里输入想显示的消息即可。3、 触发条件配置为Onload（当页面载入时），就能够用来作为打开页面的欢迎信息。如设为OnUnload(当关闭页面时)，就能够作为用户关闭页面时送别信息。4、 也能够在某一段文字上配置弹出信息。比如一段文字不愿让人复制，就选中整段文字，注意此时左下角显示P，即段落。

18、5、 然后同样操作，消息能够输入版权之类的语句。只是配置触发条件为OnBeforeCopy（按右键时触发）,或OnCopy（按右键选复制时触发）。十八、动态图片按钮1、 准备好两张同样大小的图片，常用的方法是如一张为灰度照片，一张为彩色照片。或一张是按钮凹下的样式，一张是按钮凸起的样式。2、 举例：插入一个3行1列的表格，配置宽度为180像素。3、 将光标置于第一行，插入一张灰度的图片。4、 在属性面板中“链接”一栏里输入需要链接的地址，并给图片加上名称，如tu1.5、 点击行为窗口上的“ ”按钮，从弹出菜单中选择“交换图像”。6、 此时在“图像”一栏中已显示要交换的图像，然后在“庙宇原始档为

19、”一栏里选择好交换后的那张图。7、 下面有两个参数，“预先载入图像”和“鼠标滑开时恢复图像”，都要选中。8、 同样方法创建另外两个动态按钮。十九、用框架布局页面框架由两个主要部分组成框架集和单个框架。1、 点击插入中的框架，即显示出已定义的13种框架的样式。我们上中下结构为例。2、 点击“上中下”框架结构的图标，此时在页上插入上下两个框架，将整个页面分割成了3部分。我们分别在上面输入“上”，在中间输入“中”，在下面输入“下”。 3、 先保存一下。点击菜单中的文档/保存全部。这时首先保存框架集文档，能够自己修改名字，如kuangjia.htm。然后将分别保存框架集中的其他页面。 在保存对应的页面

20、的时候，该部分会以虚线框起来，这样可将上面部分保存为shang.htm。下面部分保存为xia.htm。中间部分保存为 zhong.htm。4、至此，我们保存了四个页面，分别是框架集，和组成框架集的上、中、下三个页面。所以，其实这个框架是由四个页面组成的，所以用框架会降低一点用户浏览的速度。5、点击窗口/其他/框架，打开框架的面板。在这里单击某个框架，即可选中该框架。当框架被选中时，编辑窗口中对应的框架出现虚线。6、 如：选中上面topframe,此时属性面板上显示的是上面这个框架的属性。同样选中中间框架和下面框架，也能够分别配置他们的属性。7、 在编辑窗口中，将鼠标放在两框架之间的边框上，光标

21、将变成上下箭头形，此时点击边框，选中的是整个框架集。8、 此时属性面板上出现的是整个框架组的属性。能够在此配置框架集是否有边框、宽度及颜色等。但是最为重要的是能够在这里配置框架集中各个框架的大小。9、 在属性面板的右面的图示上选中上面框架，配置他的行为80像素，边框为0。10、选中下面框架，配置行高为30像素，边框为0。11、选中中间框架，配置行高为1，单位为相对。（相对的意思是：当前行相对于其他行所占的比例。设为1就是指占据除上和下以后的任何浏览窗口剩余空间。 12、举例：将光标置于上面框架topFrame上，右键选页面属性，配置背景色为#FF6600。然后插入/表格，插入一个1行2列，边框

22、边距都为0 的表格。配置第1个单元格的宽度为116像素，然后插入一张图片。将第2个单元格配置为水平对齐方式为居中，垂直排列方式为底部，然后依次输入“狮子座 ”、“魔蝎座”、“双子座”字样。13、将光标置于中部框架mainFrame中，右键选页面属性，配置背景色为#FFFFCC。然后插入一张大图像。14、将光标置于下面框架bottomFrame中，右键选页面属性，配置一个背景图像。15、另外做好三个页面，作为“狮子座”、“魔蝎座”、“双子座”所要链接的页面。16、选中“狮子座”，在属性中为他配置好要链接的页面，然后在“目标”里选“mainframe”，即该内容在中间那个框架中显示。17、同样配置

23、“魔蝎座”、“双子座”的链接。二十、跳转菜单1、 点击主菜单中的插入/表单对象/跳转菜单，也能够用插入/表单，中的跳转菜单图标，来调出跳转菜单配置窗口。2、 首先在“文本”一栏里输入“请选择相关网站”字样。然后点击窗口上的“ ”号按钮。这时菜单里多了一个选项，这个选项没有链接，仅作为跳转菜单的说明文字。3、 在文一栏里输入需要的网站，如“新浪”，然后在“选择时，前往URL”一栏里输入网站链接地址，此时，菜单项一栏里又多了一个选项，这个选项对应一个网的链接地址。4、 使用同样方法，在菜单中添加其他一些选项及对应的链接。还能够用“上”“下”的按钮，来调整他们的顺序。5、 配置窗口的“菜单之后插入前

24、往按钮”一项先不要选择。选中“更改URL后选择第一个项目”一项，这样当使用跳转菜单到某个页面后，假如返回到跳转菜单页面，此时页面中的跳转菜单默认显示的依旧是第1项内容。6、 配置完毕后点击“确定”即可。*因为跳转菜单是个表单，所以其实是先插入了表单（红色虚线区域），然后在表单中再插入了下拉菜单。7、 想修改选项，能够选中页面上的下拦菜单，此时点击属性面板中的“列表值”，即可修改各项内容了。8、 当选中跳转菜单时，行为窗口中也出现行为。双击该行为，也能够进入配置窗口，能够重新对其进行配置。9、 假如“菜单项”里的第一项就是链接，而不是上面所说的一句提示的话，那么就要选中“选项“中的“菜单之后插入

25、前往按钮”。添加一个“前往”按钮。二十一、运用插件（Dreamweaver功能扩展）1、 首先下载好需要的插件，此处举例用的是Animate Browser Window。这是个动态改变窗口的大小的插件。打开Dreamweaver Extension Manager，安装下载好的插件。 2、 启动Dreamweaver，在做好的页面上，右击左下角body，然后点击行为窗口中的“ ”号按钮，在其中选择“Animate Browser Window”，然后在其中做相应的配置。这里配置窗口打开之前高宽均为0，打开后为填满屏幕。触发条件为onLoad。二十二、滚动字幕1、把光标插入点放在需要插入滚动字

26、幕的地方。2、点击插入面板的“标签选择器 ”。3、选择 marquee标签，点击“插入”按钮。然后关闭“标签选择器 ”。4、转换到代码视图。把光标插入点放在 两个marquee标签之间。5、选择“窗口”/“标签检查器”。能够在“标签检查器”中配置标签的各种用法。6、点击behavior配置项右边的下拉箭头，选择滚动字幕内容的运动方式。其中三个选项意思分别是：Alternate：内容在相反两个方向滚来滚去。Scroll：内容向同一个方向滚动。Slide：内容接触到字幕边框就停止滚动。7、direction属性配置字幕内容的滚动方向。四个选项意思为：down：向下运动。Left：向左运动。Righ

27、t：向右运动。Up：向上运动。8、scrollamount属性配置字幕滚动的速度。一般设为1。9、scrolldelay属性配置字幕内容滚动时停顿的时间，单位为毫秒。假如要让滚动看起来流畅，数值应该尽量小。实例中配置为1毫秒。10、width属性配置滚动字幕的宽度。这个任意，比如配置为300。11、onMouseOver事件配置鼠标移动到滚动字幕时的动作，常配置为停止滚动。onMouseOut事件配置鼠标离开滚动字幕时的动作，常配置为开始滚动。这个两项不能选，只能手工输入。在onMouseOver后面输入“this.stop();” 在onMouseOut后面输入“this.start();”

28、12、style属性配置字幕内容的样式。实例中配置字幕文字大小，也要手工输入“font:12px;”。13、loop属性配置字幕内容滚动次数，默认值为无限。“-1”也为无限。 14、全部代码：滚动字幕内容二十三、创建CSS样式表1、在网页上输入一些文字。2、打开“CSS样式”面板，也能够用“窗口/CSS样式”打开。3、面板下方有四个按钮，分别是附加样式、新建样式、编辑样式、删除样式。4、点击“新建样式”，打开对话框。输入名称，注意名称前有一个点号。如取名为.zi(中文名不行)。类型：创建自定义样式，定义在：仅对该文档。5、此时再打开一个对话框，在左边的分类里选择“类型”，然后在右面配置字体为宋

29、体，大小为14像素，颜色任意。然后确定。6、选中页面上的文字，然后点击窗口里的样式.zi。此时这段文字就应用了CSS样式。7、如要对刚才定义的CSS样式进行修改，能够点中他，然后点下面的编辑样式按钮。二十四、创建动态链接样式表1、点击“新建CSS样式”对话框，在“定义在”一栏选择“仅对该文档”，在“类型”一栏里选择“使用CSS选择器”。2、当样式表类型选择“使用CSS选择器”时，下拉菜单的名字变成了“选择器”，表示输入内容为CSS选择符，单击下拉按钮，能够看到动态链接的4种状态。a:link终极链接的正常状态； a:visited访问过的终极链接状态。a:hover光标移至终极链接上时的状态；

30、 a:active选中终极链接的状态。3、 接下来对这几种状态分别设定，首先从下拉菜单中选择a:link，点击“确定”按钮后弹出样式表配置窗口，设定该样式无下划线，颜色为#FF6600（橙色）。4、 用同样方法设定a:visited，设定其为无下划线，颜色为#FFFF00（黄色）。5、 接下来设定a:hover，设定其为有划线，颜色为#FF6600（橙色）。6、 a:active不用配置，他会自动依照a:hover而定。7、 在网页上输入一句话，在属性面板中设定他的链接为“#”。即可。*注意：必须按照这样a:link、 a:visited 、a:hover 、a:active的顺序来配置，否则

31、不会出现预期的效果。假如我们需要一个页面上有两个或更多的链接效果，能够用以下方法：1、 点击新建样式按钮，样式类型选“使用CSS选择器”，在“选择器”一栏里，直接输入a.link2:link，接着配置a.link2:link为红色无下划线。2、 继续定义下面两个样式。名称都直接输入，分别设定他们为a.link2:visited，紫色无下划线。 a.link2:hover，蓝色有下划线。3、 此时在“CSS样式”选项下多了一个名称为link2的自定义样式。4、 在页面中输入一段话，为他添加一个#链接，选中这个链接，然后点击样式表窗口中的样式link2，将此样式应用在该链接上。5、 同样方法能够制

32、作同一页面上的不同链接格式。*为保持一种风格，同一页面上不宜建立过多的链接样式。二十五、外部样式表*在不同的页面中应用相同的样式表。1、 新建样式表，取名，然后类型选“创建自定义样式”，定义在选“新建样式表文档”。2、 确定后，打开保存外部样式表的窗口。然后把他保存到本地站点中即可。3、 此时，能够看到样式表窗口中新增了一个样式表文档，文档的后缀名为css4、 假如当前页面中的一个内部样式表要导出为外部样式表文档，以便供其他页面使用，能够点击样式表窗口右上角的灰色的图标，选“导出样式表”，此时能够为样式取名和保存为一个外部文档。5、 当其他页面需要使用外部样式表时，能够点样式表窗口中的第一个按

33、钮“附加样式表”，打开窗口，然后选择外部样式表文档，在添加为里选“链接”，确定即可。二十六、其他CSS*CSS里的背景，是配置文字背景、表格背景图等。*CSS里的区块，是指配置文本的文字间距、对齐方式、下标、上标、排列方式等。*CSS里的盒子，是指配置图片和文本内容之间的空白距离，连同图文混排的方法。*CSS里的边框，是指配置表格文本区、按钮等的美化。*CSS里的列表，是指配置列表项样式。即那种提纲式的一段话。*CSS里的定位，是指配置页面中图片的相对和绝对定位。*CSS里的扩展，其中的光标，能够配置光标的样式，能够配置为hand（手型）、crosshair（十字型）、text（“I”型）、w

34、ait（等待型）、default（默认型）、help（帮助型），更有各种方向的箭头型。*CSS里的扩展，其中的过滤器，能够用来做CSS滤镜特效，即用来加工图片的透明、发光等。但效果不太明显，还是用专门加工图片的软件来完成比较好。二十七、创建网上相册1、 首先要安装好FireworksMX软件。2、 加工好所需要放在网上的照片，把他们加工成相同大小，放在一个文档夹里。3、 点击菜单中的命令/创建网站相册，打开配置窗口。4、 输入相册标题，副标信息，其他信息（以后也可再修改）。“源图像文档夹”，选择刚才保存照片的文档夹。5、 “目标文档夹”，单击“浏览”按钮选择当前站点目录。（即将照片全部保存到站

35、点里来）6、 “缩略图大小”一项，能够根据需要选择，“显示文档名称”一项，选中会在生成的相册中显示每个图片的文档名。7、 “列”一格是每一行显示的图片数，默认为5，能够自己改变。8、 下面两个“格式”一般都选“品质较高”。9、 选中“为每张图片建立导览页面”一项。确定即可。二十八、定制网页过渡功能*网页过渡是指当浏览者进入或离开网页时，页面呈现的不同的刷新效果，比如卷动、百叶窗等。网页看起来会更具备动感，但是也要注意适可而止，否则太花哨的变化也容易引起浏览者的反感。步骤：1、 打开一个页面，单击菜单中的插入/文档头标签/Meta，会弹出Meta对话框。2、 在对话框中的属性选项的下拉列表中选H

36、TTP-equivalent选项，在值一格中键入Page-Enter，表示进入网页时有网页过渡效果。3、在内容一格中键入 Revealtrans(Duration=4,Transition=2),Duration=4 表示网页过渡效果的延续时间为4秒，Transition表示过渡效果方式，值为2时表示圆形收缩。4、输入完后单击确定，存盘。这样当我们点击一个超链接进入这个页面时就能够看到效果了。5、另外更有二十多种效供您选择，只要将Transition的值改为相应的效果的代号即可，具体效果和配置如下表所示效果 Transition 效果 Transition盒状收缩 0 溶解 12盒状展开 1

37、左右向中部收缩 13圆形收缩 2 中部向左右展开 14圆形展开 3 上下向中部收缩 15向上擦除 4 中部向上下展开 16向下擦除 5 阶梯状向左下展开 17向左擦除 6 阶梯状向左上展开 18向右擦除 7 阶梯状向右下展开 19垂直百叶窗 8 阶梯状向右上展开 20水平百叶窗 9 随机水平线 21横向棋盘式 10 随机垂直线 22纵向棋盘式 11 随机 23二十九、库的应用*网站中有些内容需要反复使用，比如自己制作的一个网站图标等，此时将这个组件存为在库里，能够随时调用。1、 打开一个页面，选择需要保存的组件，比如一个图标。2、 点击菜单窗口/资源，打开资源窗口。然后在其中选最下面一本书样的

38、按钮，打开库面板。3、 点击下面的新建按钮，就将刚才选中的图标保存到库里了，此时还能够给他取名。4、 在一个新页面上要应用库里的内容时，打开库面板，选中需要用的图标，然后点击下面的“插入”即可。三十、用模板迅速完成站点（首页或内部某一页）1、 首先规划好自己想要制作的网站，要把他的各项链接的内容都设计好。如我的网站：首页上的链接有：网页版、动画版、请留言、关于我、联系我、许愿瓶网页版上的链接有：站长简介| |教研论文| |课堂寻真| |原创课件| |心海撷贝| |留影人生| |给我来信| |雁过留声|动画版上的链接和网页版相同。以下再链接到各种文章或课件的页面。如“课堂寻真”链接到全是教案标题的页面，然后由每一个教案标题，再链接到放这个教案的页面。其他同理。2、下载好比较适合自己规划的、所喜欢的网页模板，（模板网站比较好的如： ）一般他都包括两个文档：一个是index.htm，另一个一般是命名为images的文档夹，即我们所说的用来放置图片的。3、 定义好站点，然后将这两个文档（夹）复制到站点文档夹下。4、 双击index.htm文档，即进入首页的编辑状态。然后就能够修改这个页面让他符合自己的需要。这样即可完成首页。三十一、将已有的网页保存为模板*用于在一个网站中有大量重复出现的页面时。（在新建和使用模板之前一定要定义好站点）1