在HTML页面中,可以使用框架将页面分割成多个区域,每个区域可以独立显示内容,也可以使用框架引入其它页面到当前页面中。
但是框架对SEO不太友好,一般应用于网站的后台布局中。
在HTML的框架系统中存在一系列标签,本文先讲 frameset、frame和noframes,它们三个是一起用,无法独立使用。
- frameset为框架集,在这个集合里可以使用frame定义一些列框架。请注意:frameset不允许放在body标签中,否则无法使用。
- frame是frameset的子框架,它不允许独立使用,只能出现在frameset中。
- noframes表示当浏览器无法解析frameset时则显示noframes标签中的内容,目前99%的浏览器都支持框架,所以并不常用。
复制代码
请先看如下实例:
我们定义了一个frameset框架集,在frameset中定义了四个子框架frame,子框架分别引入abcd四个html页面。
当我们给frameset的rows属性设置为100,200时表示框架集的第一行的宽度为100,第二行的宽度为200,如果是三行那就定义三个值。
当我们给frameset的cols属性设置为100,200时表示框架集的第一列的宽度为100,第二列的宽度为200,如果是三列那就定义三个值。
请注意:以上所说的100和200并非像素单位,而是比例关系,例如rows="100,200",它实际表示的是:第二行的宽度是第一行的2倍。
最终的显示效果如下:
当然框架不仅支持引入本地html页面,而且可以引入网络html页面,如下:
本课程的测试代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HTML中框架 frameset frame noframes</title>
</head>
<frameset rows="100,100" cols="100,100">
<frame src="https://www.teamczyx.com" />
<frame src="https://www.teamczyx.com" />
<frame src="https://www.teamczyx.com" />
<frame src="https://www.teamczyx.com" />
<noframes>您的浏览器不支持解析框架</noframes>
</frameset>
</html>
|