简单对HTML框架知识进行总结
在介绍框架之前,读者有必要先了解一下响应式web网页的设计概念。
响应式web网页设计的定义:
页面的设计与开发,应当根据用户行为以及设备环境进行相应的响应。也就是说,当运行设备变化时,网页依旧能够适应这种变化,达到在不同的设备环境下,展示出相同的页面效果。
说明:框架的出现,让我们对页面的布局,能够更好的调整与控制。
在html中,使用框架结构标签(<frameset>)配合使用百分比,定义如何将窗口分割为框架。
框架样式主要包括:
垂直(columns)框架
<frameset cols="25%,25%,50%> <frame src="1.html"> <frame src="2.html"> <frame src="3.html">
</frameset>
水平(rows)框架
<framesetrows="25%,25%,50%"> <frame src="1.html"> <frame src="2.html"> <frame src="3.html">
</frameset>
内联(iframe)框架
<html>
<head>内联框架展示</hesd>
<body>
<iframe src="1.html" width="200" height="200" frameborder="0"></iframe>
<p>某些老式的浏览器不支持内联框</p><p>如果不支持,iframe是不可见的</p>
</body>
</html>
说明:width设置内联框架的宽,height设置内联框架的高,frameborder=“0”删除框架的边框。以上提到的1.html 2.html 3.html用于举例,需要读者自己根据需求,提前编辑好。
<noframes>标签的使用方法
<html>
<frameset cols>="25%,50%,25%">
<frame src="1.html"> <frame src="2.html">
<frame src="3.html">
<noframes>
<body>您的浏览器无法处理框架</body></noframes>
</frameset>
</html>
重要提示:
不能将<body></body>和<frameset></frameset>标签同时使用。
不过,假如添加包含一段文本的<noframes>标签,就必须将这段文字嵌套在<noframes><body></body></noframes>标签里面。
网友评论