程序员

HTML 框架

2019-01-22  本文已影响39人  87fff849858f

  简单对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>标签里面。

上一篇 下一篇

猜你喜欢

热点阅读