Frameset 框架集
1.Frameset叫框架集。关于布局有很多种方式,框架集是比较古老的方式。
2.通过使用框架集,你可以在同一个浏览器窗口中显示不止一个HTML页面。每个HTML页面称为一个框架,多个框架组成一个框架集。
3.框架集是网页开发必须掌握的知识。例如后台架构、局部刷新、页面分割,都是框架集的表现,尤其是后台页面制作。
4.和框架集相关的三个标签 frameset 标签、frame 标签、iframe 标签。使用 frameset 时不可以和 body 同时使用,因为它们是同级的。一个 frame 引导 了一个 html文档。一个框架集可包含多个 html文档。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Frameset框架集</title> </head> <!-- * : 代表余下所有的空間--> <frameset rows="50%,*"> <frame src="https://www.baidu.com/"/> <frame src="https://www.so.com/?src=hao_360so_button&ls="/> </frameset> </html>
5.Frameset 的一些属性
cols 把一个浏览器窗口按列进行切割(%、px、*)
rows 把一个浏览器窗口按列进行切割
border 框架边的大小
bordercolor 框架边的颜色
frameboder 是否显示框架边(yes或no)、(1或0),默认显示
name 框架名称。
src 此框架要显示的网页名称或路径。此为必须设置的属性。
scrolling 是否要显示滚动条 (yes或no),默认可滚动
noresize 是否可改变框架大小 ,默认可以改变
设置了noresize的frame会影响其它两旁的frame,如果当前frame在最边上,则只影响它本身。
chrome 可设置在 frameset 中,这样全局都不可拖动,而火狐要设置在具体的 frame 上。
noframes 如果不支持 framset 框架集的话,
要使用<noframes> <body>您的浏览器无法处理框架!</body> </noframes>
iframe 内联框架 可以包含在 body 中,和普通的元素一样 相关属性
①width 可设置内联框架的宽
②height 可设置内联框架的高
③name 设置框架名称
④src 设置页面的路径
⑤scrolling="" yes/no 滚动条
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Frameset框架集</title> </head> <frameset name="body" cols="50%,*" border="2" bordercolor="red" noresize="noresize" > <frame src="https://www.baidu.com/" scrolling="no"/> <frame src="https://www.so.com/?src=hao_360so_button&ls=" scrolling="yes"/> </frameset> <noframes> <body> 您的浏览器无法处理框架! </body> </noframes> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Frameset框架集</title> </head> <frameset rows="30%,*"> <frame src="https://www.baidu.com/" /> <frameset cols="30%,*"> <frame src="https://www.so.com/?src=hao_360so_button&ls=" /> <frame src="https://www.baidu.com/"/> </frameset> </frameset> <noframes> <body> 您的浏览器无法处理框架! </body> </noframes> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Frameset框架集</title> </head> <body> <a href="http://www.w3school.com.cn/tags/tag_iframe.asp" target="frameset">点击</a> <iframe name="frameset" src="https://hao.360.com/" width="500px" height="400px"></iframe> </body> </html>