网站建设
移动互联网
品牌设计
创新应用
新闻动态
网站百科
简体

frame网页框架的布局教程

时间:2015-08-07 来源:尚品中国 类型:网站百科
字号:   

框架是一种特殊的XHTML布局方式。其可以通过frame标签将网页划分为多个区域,并通过这些区域来显示不同的网页。在框架网页中,必须使用frameset标签将这些框架组织起来,组合成为框架集。

1.框架和框架集

框架和框架集是两个不同的事物。网站制作框架仅仅是网页中的一个区域,在该区域中可以显示与浏览器窗口中其他区域内容无关的XHTML文档。通常两个或两个以上的框架可以组合成一个网页。

框架集则是一种HTML文档的类型,其定义一组框架的布局方式以及属性,如框架的数目、大小、位置以及在每个框架中初始显示的URL。框架集文件本身不包含要在浏览器中显示的HTML内容,其仅仅是为浏览器提供显示各个框架的方法和规范。通常所说的框架网页,就是包含框架的框架集构成的网页。

2.框架网页的优点

框架网页有着鲜明的特点。在设计网页的过程中,使用框架必须符合简单、易用、便于浏览和维护的条件。

布局简单

在使用Dreamweaver设计网页时,为网页布局最常用的工具是层<div>或者表格<table>。在使用层或表格布局时,通常需要不断地在网页中插入各种标签和对象,并为这些对象设置属性等。而使用框架则布局非常简单,通过鼠标单击儿次就可以实现网页的整体布局,所有的大小宽窄都可以通过鼠标拖动来实现。

制作方便

在使用Dreamweaver制作整个网站时,网站的每个页面都有一些相同的元素,例如,导航条、版尾等。之前已经介绍了使用库来插入这些元素。其实可以使用框架设计网页,将导航条和版尾等保存为单独的网页,并通过框架来调用,一个导航条页面和一个版尾页面可以供整个网站所有网页使用。

适用于长页面

在一些比较长的网页中(例如大段的文章或博客,以及网站的后台程序页面等),用户可能需要拖动滚动条来浏览整个网页。在普通的网页中,当用户浏览完网页后,通常需要将滚动条拖回网页顶部才可以继续使用导航条。如果在网页中使用了框架并将导航条作为单独框架,则用户无须拖动滚动条即可直接使用导航条。正因为该优点,很多论坛都喜欢用框架来制作导航条。

框架网页通常是由多个网页组成的。例如,某个网页是有3个框架组成,那么其应包含4个网页,框架集和每个框架都应该有一个单独的网页。框架集控制每个框架中的网页显示的方式。

在Dreamweaver中为用户预先定义了多种框架集类型。使用这些预先定义的框架集类型,可以方便地创建各种布局方式的框架网页。在制作框架网页之前,应该执行【查看】【可视化助理】【框架边框】命令,使Dreamweaver能够显示框架的边框。制作框架布局的网页,通常有以下4种方法。

1.新建框架网页

在Dreamweaver中,执行【文件】【新建】命令,打开【新建文档】对话框。在该对话框中,选择【示例中的页】【框架集】选项,即可在列表菜单中选择各种框架,如图5-22所示。

新建框架网页

2.插入框架集

除了新建框架网页外,还可以在已创建的其他类型网页中插入框架集。打开需要插入框架的网页,在【插入】工具栏中单击【布局】【框架】口,,即可弹出框架类型的菜单。单击相应的框架类型,同样可以建立框架网页,如图5-23所示。

插入框架集

3.拆分框架

拆分框架也是创建框架网页的一种常用方式。打开网页文档后,执行【修改】【框架集】命令,即可选择【拆分左框架】等子命令。

4.插入HTML

另外一种插入框架网页的方法是在打开的网页中执行【插入记录】【HTML】【框架】命令,即可选择各种类型的框架将其HTML代码插入到网页中。

插入框架后,将弹出【框架标签辅助功能属性】对话框。在该对话框中,可以为每个框架设置一个标题。设置完标题后,单击【确定】按钮,即可完成框架的创建。


扫描左侧二维码添加客户经理微信

010-60259772

请提供您的联系电话,尚品中国项目经理会尽快与您联系。