一個瀏覽器窗體可以通過幾個頁面的組合來顯示。我們可以使用框架來完成(frames)這項工作。(框架可以把HTML文檔分為多個頁面)
詳情可見:http://www.dreamdu.com/xhtml/tag_frame/
主要概念:框架標簽
framHTML框架使用frameset標簽把瀏覽器的窗體分為多個行與列的框架頁,每個頁面又使用了[frame]標簽定義,同時應該使用定義瀏覽器不支持框架時顯示的內容。
1、frameset:框架標簽
rows 橫向分割 ,定義了框架含有多少列與列的大小(每個值使用逗號分隔),取值為象素px或者百分比%
cols 縱向分割,定義了框架含有多少行與行的大小(每個值使用逗號分隔),取值為象素px或者百分比%
表示自適應尺寸
<frameset rows="10%,,50px"> 頭部占10%、底部占50px、中間高度自適應
2、使用frame標簽嵌套其他html頁面 。
3、使用nresize屬性固定frame的尺寸。
4、在frame中設置name屬性==該頁面的名稱:使用如在left.html中將a標簽鏈接內容在right.html中顯示
框架標簽的使用.png
一、index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<frameset rows="10%,*,50px">
<frame src="top.html" noresize="noresize"/>
<frameset cols="30%, *">
<frame src="left.html" noresize="noresize"/>
<frame src="right.html" name="Right"/>
</frameset>
<frame src="bottom.html" noresize="noresize"/>
</frameset>
<noframes>
<body>
夢之都使用了框架技術,但是您的瀏覽器不支持框架,
請升級您的瀏覽器以便正常訪問夢之都。
</body>
</noframes>
</html>
二、top.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>上方頁面</title>
</head>
<body bgcolor="palevioletred">
上方
</body>
</html>
三、bottom.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>下方頁面</title>
</head>
<body bgcolor="red">
下方
</body>
</html>
四、left.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>左側頁面</title>
</head>
<body bgcolor="orangered">
<a target="Right">貓撲</a>
<a target="Right">打噴嚏</a>
<a target="Right">cnbeta</a>
<a target="Right">51.aspx</a>
</body>
</html>
五、right.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>右側頁面</title>
</head>
<body bgcolor="blue">
right
</body>
</html>