项目六任务2制作班级网站子页----浮动框架网页. 下载本文

内容发布更新时间 : 2024/11/13 6:41:40星期一 下面是文章的全部内容请认真阅读。

《前台页面设计》 项目六 设计制作“班级”网站

教学班级 授课课题 教学目标: 1. 了解浮动框架在网页中的应用。 2. 掌握浮动框架网页的制作方法。 教学重点: 1.浮动框架网页的制作方法。 2.浮动框架网页的链接方法。 教学难点 1. 浮动框架网页的制作方法。 2. 浮动框架网页的链接方法。 教学环境 教学过程 机房+电子教室 教学内容 上节课学习了框架和框架集的创建与编辑方法, 以及框架和框架集属性的设置方上节回顾 法。请同学们回答两个问题: 1. 三个框架组成的网页有几个?它们的默认名字分别是什么? 2. 框架网页的标记有哪些? 新课讲授 一.设置浮动框架 浮动框架是一种特殊的框架页面,在浏览器窗口中可以嵌套子窗口,在其中显示页面的内容。浮动框架可以插入在页面中的任意位置。浮动框架需要用手写代码的方式来实现。 1.设置浮动框架——标记 属性说明: ? ALIGN=“{LEFT,RIGHT,CENTER}”:指定浮动框架的对齐方式(左对齐、居中、右对齐) ? BORDER=“n”:指定浮动框架的框线大小(仅适用于IE4) ? ? ? ? ? ?

课时 2 任课教师 仝素梅 任务2 制作班级网站子页----浮动框架网页 BORDERCOLOR=“#RRGGBB”或“?”:指定浮动框架的框线颜色 FRAMEBORDER=“{1,0}”:指定浮动框架的框线显示与否 HEIGHT=“n”:指定浮动框架的高度 MARGINHEIGHT=“n”:指定浮动框架的上下边界大小 NAME=“?”:指定浮动框架的名称 SCROLLING=“{YES,NO}”:指定浮动框架的卷轴显示与否 1

《前台页面设计》 ? ? SRC=“URL”:指定浮动框架的来源网页的相对或绝对位置 WIDTH=“n”:指定浮动框架的宽度 特殊的TARGET属性值 除了我们使用标记为框架指定的名称,TARGET属性的值也可以是如表6-1所示的特殊名称。 属性值 用途 TARGET=“框架名称” 将超链接或热点所连接的网页显示在双引号(“)所指定的框架名称中 TARGET=“_self” 将超链接或热点所连接的网页显示在目前的框架中 TARGET=“_blank” 将超链接或热点所连接的网页显示在新打开的窗口中 TARGET=“_parent” 将超链接或热点所连接的网页显示在目前文件的父框架中 TARGET=“_top” 将超链接或热所连接的网页显示在浏览器窗口,取消所有框架 关于上述的属性值,有下列几个注意事项: ? 若超链接或热点所连接的网页位于其他网站,而您不希望浏览者就此离开您的网页,可以使用TARGET=“_blank”,将所连接的网页显示在新窗口,这样您的网页也会显示在屏幕上。 ? 如果您想将超链接或热点所连接的网页显示在没有框架的网页,可以使用TARGET=“_top”。 ? 当没有使用TARGET属性时,表示将超链接或热点所连接或热点所连接的网页显示在目前的框架中。 ? 当使用标记的TARGET属性指定目标框架时,表示将全部超链接或热点所连接的网页显示在指定的框架中。 2.浮动框架的链接 在浮动框架中,也可以制作页面之间的链接。创建链接的方式同样是先用name属性为浮动框架命名,再将链接的目标浏览器窗口指向命名的浮动框架。 二.制作浮动框架页面 1.制作浮动框架网页 新建一个“友好班级”网页,在网页中插入浮动框架,代码如下:

2.分别创建11wang.html,12ruanjian.html,12wang.html和11ying.html四个网页,在浮动框架中显示,添加代码如下:

2

《前台页面设计》 3.将“友好班级”网页和“班级网站”首页进行链接,制作网页效果图如下: 3