HTML框架:
1.frameset框架集
2.iframe內嵌框架
1.frameset框架集
1.1 創建框架網頁的步驟:
(1)創建各個子窗口對應的HTML文件
(2)創建整個框架文件,分別引用子窗口文件
1.2 創建框架頁面的基本語法:
<frameset cols="25%,50%,*" row="50%,*" border="5">
<frame src="top.html">
......
</frameset>
注:rows和cols不會同時出現,cols表示從橫向划分,rows表示從豎向划分。“*”表示剩余的。
注意:<frameset></frameset>標簽不能與<body></body>標簽同時使用。除非你在<frameset>中使用<noframes>標簽。即:
<frameset>
<noframes>
<body></body>
</noframes>
</frameset>
1.3 <framset>框架集標簽中的常用屬性
例如:水平框架
<frameset rows="25%,50%,25%">
<frame src="header.html" />
<frame src="body.html" />
<frame src="footer.html" />
</frameset>
例如:垂直框架
<frameset cols="25%,50%,25%">
<frame src="header.html" />
<frame src="body.html" />
<frame src="footer.html" />
</frameset>
2.iframe內嵌框架
常用屬性
語法:
<body>
<iframe src="引用頁面地址" name="框架標識名" frameborder="邊框" scrolling="yes"></iframe>
</body>
舉個例子:(如下代碼)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>內嵌框架</title> </head> <body> <iframe name="topIframe" width="100%" height="400px" src="https://www.baidu.com/" frameborder="1" scrolling="auto"></iframe> <p> <a href="https://www.baidu.com/" target="topIframe">百度 </a> <a href="http://www.sina.com.cn" target="topIframe">新浪</a> </p> </body> </html>
運行結果:
點擊百度在上面的框內顯示百度頁面,點擊新浪則顯示新浪頁面。