(
课件网) 框架布局网页 1 框架与框架式网页 什么是框架布局网页？ 一般来说，框架技术主要是通过两种类型的元素来实现的：框架集、框架。 框架是将浏览器窗口划分为不同的部分，每部分装载不同的网页，从而获得在一个浏览器窗口同时显示多个页面的特殊效果。此外，通过为超链接指定目标框架，可以为框架之间建立内容之间的联系，可以实现页面导航的功能。 2 制作“我的作品”页面 设计“E动少年”网站“我的作品”板块内容结构，制作网页，将以前自己制作的图両、动両等电子作品展示出来。 制作“我的作品”网页，分为准备素材、版面设计、内容编排等步骤。 准备素材。收集整理以前制作的绘画、电子板报、动画、网页等电子作品，每种类型作品各选五个。 用框架布局网页。上部框架显示横幅和导航条，左框架显示作品类型，右框架显示作品名称列表。单击作品类型，右框架显示对应的作品名称列表；单击作品名称，在新窗口显示对应的作品。 任务分析 在站点根目录“myweb”下新建“zuopin”文件夹，在该文件夹下新建“huihualist.htm”、“banbaolist.htm”、“donghualist.htm”、“wangyelist.htm”四个网页和“images”文件夹并复制各作品文件到“images”文件夹内。 在“huihualist.htm”网页中插入5行1列，宽度是“100%”的表格，设置表格“水平居中”。各行分别输入绘画作品名称，设置文字左对齐，分別为每个作品名称创建超链接到对应的作品。用同样方法制作其他三个网页文件。 使用框架布局网页 3 美化网页 将光标置于框架Tep Frame内，选择“插入———媒体———Flash”，插入大小适当的Flash文件作为网页横幅。通过设置字体和框架背景美化网页。 4 创建导航链接 导航条是实现网站栏目之间跳转的一种方式，能方便浏览者在不同页面之间的跳转浏览。 在Photoshop中制作与网站风格相匹配的导航图片，一个栏目名称做成一张图片，整个网页的导航条由五张图片组成，在属性面板中设置导航图片的宽、高，使导航图片的大小一致，将导航图片保存到站点根目录“myweb”下的“images”文件夹中。 5 在页面设置浮动图片 经常在一些网页上看到飘动的图片，我们使用层和时间轴也可以实现。 6 思考与练习 用左右结构框架制作一个蝴蝶图片展，左框架显示五种蝴蝶的名称，单击蝴蝶名称，右框架显示相对应的蝴蝶图片和介绍。 THE END
