index.htm
復制代碼 代碼如下:
<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>frame框架的顯示隱藏操作 - 51windows.net</title>
</head>
<frameset name="full" rows="64,*,64">
<frame name="top" scrolling="no" xnoresize target="contents" src="top.htm">
<frameset cols="25%,*" name="cen">
<frame name="contents" target="main" src="left.htm">
<frame name="main" src="main.htm">
</frameset>
<frame name="bottom" scrolling="no" xnoresize target="contents" src="bottom.htm">
<noframes>
<body>
<p>此網頁使用了框架，但您的浏覽器不支持框架。</p>
</body>
</noframes>
</frameset>
</html>
main.htm
復制代碼 代碼如下:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>main - 51windows.net</title>
</head>
<body>
<SCRIPT LANGUAGE="javascript">
<!--
function shtop(){
if (parent.full.rows.indexOf("0,*,")!=-1){
parent.full.rows="64,*,"+parent.full.rows.split(",")[2]
document.getElementById("shtop").value="隱藏上部";
}
else{
parent.full.rows="0,*,"+parent.full.rows.split(",")[2]
document.getElementById("shtop").value="顯示上部";
}
}
function shleft(){
if (parent.cen.cols=="0,*"){
parent.cen.cols="25%,*,"
document.getElementById("shleft").value="隱藏左部";
}
else{
parent.cen.cols="0,*"
document.getElementById("shleft").value="顯示左部";
}
}
function shbottom(){
if (parent.full.rows.indexOf(",*,0")!=-1){
parent.full.rows=parent.full.rows.split(",")[0]+",*,64"
document.getElementById("shbottom").value="隱藏下部";
}
else{
parent.full.rows=parent.full.rows.split(",")[0]+",*,0"
document.getElementById("shbottom").value="顯示下部";
}
}
function maxmain(){
if (parent.full.rows=="0,*,0"){
parent.full.rows="64,*,64"
parent.cen.cols="25%,*"
document.getElementById("maxmain").value="隱藏左上下";
document.getElementById("shtop").value="隱藏上部";
document.getElementById("shleft").value="隱藏左部";
document.getElementById("shbottom").value="隱藏下部";
}
else{
parent.full.rows="0,*,0";
parent.cen.cols="0,*";
document.getElementById("maxmain").value="顯示左上下";
document.getElementById("shtop").value="顯示上部";
document.getElementById("shleft").value="顯示左部";
document.getElementById("shbottom").value="顯示下部";
}
}
//-->
</SCRIPT>
<input type="button" name="maxmain" id="maxmain" onclick="maxmain();" value="隱藏左上下">
<input type="button" name="shtop" id="shtop" onclick="shtop();" value="隱藏上部">
<input type="button" name="shleft" id="shleft" onclick="shleft();" value="隱藏左部">
<input type="button" name="shbottom" id="shbottom" onclick="shbottom();" value="隱藏下部">
</body>
</html>
框架的嵌套:
復制代碼 代碼如下:
<html>
<head>
</head>
<body>
<iframe width=468 height=60 src=abc.aspx></iframe>
<iframe width=468 height=60 src=cde.aspx></iframe>
</body>
</html>
#################################################
復制代碼 代碼如下:
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312">
<title>無標題文檔</title>
</head>
<frameset rows="77,181" cols="*" framespacing="0" border="0">
<frame src="abc.aspx">
<frame src="cde.aspx">
</frameset>
<noframes><body>
</body></noframes>
</html>
//*****************說明************************：
frameset是框架，一個網頁被劃分成幾個塊， 每個塊為不同的網頁文件。iframe是內嵌網頁，可以被嵌在一個頁頁的任何地方。一般iframe使用靈活些。
當使用框架時頁面中不應該有body標簽。
frameset標簽是成對出現的,以<frameset>開始,</frameset>結束，裡面用frame。
frameset裡面還能嵌入frameset。嵌套框架,框架可以進行多層嵌套。
frameset裡面的id,為了方便後面用Javascript來訪問這個對象.
如下：
復制代碼 代碼如下:
<frameset rows="58,*" frameborder="NO" border="0" framespacing="0">
<frame src="top.htm" name="topFrame" scrolling="NO" noresize ><!--頁頭-->
<frameset rows="*,20" cols="*" framespacing="0" frameborder="NO" border="0">
<frameset rows="*" cols="120,15,*" framespacing="0" frameborder="NO" border="0" id="leftFrameSet">
<frame src="menu.htm" name="leftFrame" scrolling="NO" noresize><!--菜單-->
<frame src="mid.htm" name="midFrame" scrolling="NO" noresize><!--菜單收縮條-->
<frameset rows="35,*" framespacing="0" frameborder="NO" border="0">
<frame src="navi.htm" name="righttop" scrolling="NO" noresize><!--導航-->
<frameset cols="*,200" framespacing="0" frameborder="NO" border="0">
<frame src="" name="mainFrame">
<frame src="" name="rightFrame" scrolling="NO">
</frameset>
</frameset>
</frameset>
<frame src="bottom.htm" name="bottomFrame" scrolling="NO" noresize><!--頁尾-->
</frameset>
</frameset>
常用框架structure:
HTML語言剖析-frameset <FRAMESET> <FRAME>
<NOFRAMES>
<IFRAME>
■ 框架概念 ：
所謂框架便是網頁畫面分成幾個框窗，同時取得多個 URL。只 要 <FRAMESET> <FRAME> 即可，而所有框架標記 要放在一個總起的 html 檔，這個檔案只記錄了該框架 如何劃分，不會顯示任何資料，所以不必放入 <BODY> 標記，浏覽這框架必須讀取這檔 案而不是其它框窗的檔案。<FRAMESET> 是用以劃分框窗，每一框窗由一個 <FRAME> 標 記所標示，<FRAME>必須在 <FRAMESET> 范圍中使用。如下例：
復制代碼 代碼如下:
<frameset cols="50%,*">
<frame name="hello" src="/up2u.html">
<frame name="hi" src="me2.html">
</frameset>
此例中 <FRAMESET> 把畫面分成左右兩相等部分，左便是顯示 up2u.html，右邊則會顯示 me2.html 這檔案，<FRAME> 標記所標示的框窗永遠是按由上而下、由左至右的次序。
本節與 Composer 教室的【運用框架】大部分相同，只是本節增加了內容及較為詳細，正 如其它篇章一樣並不會提及網頁制作工具，若饋下學會了 HTML 相信你亦不會選用 Composer ， FrontPage 一類的工具了。
■ <FRAMESET> <FRAME> ： ▲Top
<FRAMESET> 稱框架標記，用以宣告HTML文件為框架模式，並設定視窗如何分割。
<FRAME> 則只是設定某一個框窗內的參數屬性。
<FRAMESET> 參數設定：
例子：<frameset rows="90,*" frameborder="0" border=0 framespacing="2" bordercolor="#008000">
COLS="90,*"
垂直切割畫面(如分左右兩個畫面)，接受整數值、百分數， * 則代表占用馀下空 間。數值的個數代表分成的視窗數目且以逗號分隔。例如 COLS="30,*,50%" 可以 切成三個視窗，第一個視窗是 30 pixels 的寬度，為一絕對分割，第二個視窗是當 分配完第一及第三個視窗後剩下的空間，第三個視窗則占整個畫面的 50% 寬度 為 一相對分割。您可自己調整數字。
ROWS="120,*"
就是橫向切割，將畫面上下分開，數值設定同上。唯 COLS 與 ROWS 兩參數盡量 不要同在一個 <FRAMESET> 標記中，因 Netacape 偶然不能顯示這類形的框架，盡 采用多重分割。
frameborder="0"
設定框架的邊框，其值只有 0 和 1 ， 0 表示不要邊框， 1 表示要顯示邊框。（避 免使用 yes 或 no ）
border="0"
設定框架的邊框厚度，以 pixels 為單位。
bordercolor="#008000"
設定框架的邊框顏色。
framespacing="5"
表示框架與框架間的保留空白的距離。
<FRAME> 參數設定：
例子：<frame name="top" src="a.html" marginwidth="5" marginheight="5" scrolling="Auto" frameborder="0" noresize framespacing="6" bordercolor="#0000FF">
SRC="a.html"
設定此框窗中要顯示的網頁檔案名稱，每個框窗一定要對應著一個網頁檔案。你可 使用絕對路徑或相對路徑，有關此兩者詳見於【連結進階】。
NAME="top"
設定這個框窗的名稱，這樣才能指定框架來作連結，必須但任意命名。
frameborder=0
設定框架的邊框，其值只有 0 和 1 ， 0 表示不要邊框， 1 表示要顯示邊框。（避 免使用 yes 或 no ）
framespacing="6"
表示框架與框架間的保留空白的距離。
bordercolor="#008000"
設定框架的邊框顏色。顏色值請參考【HTML 剖析】。
scrolling="Auto"
設定是否要顯示卷軸，YES 表示要顯示卷軸，NO 表示無論如何都不要顯示， AUTO是視情況顯示。
noresize
設定不讓使用者可以改變這個框框的大小，亦沒有設定此參數，使用者可以很隨 意地拉動框架，改變其大小。
marginhight=5
表示框架高度部份邊緣所保留的空間。
marginwidth=5
表示框架寬度部份邊緣所保留的空間。
以下是一些例子：（與 Composer 教室的【運用框架】相同）
例子 HTML Code
復制代碼 代碼如下:
<frameset rows="80,*">
<frame name="top" src="/a.html">
<frame name="bottom" src="/b.html">
</frameset>
例子 HTML Code
復制代碼 代碼如下:
<frameset rows="80,*,80">
<frame name="top" src="/a.html">
<frame name="middle" src="/b.html">
<frame name="bottom" src="/c.html">
</frameset>
例子 HTML Code
復制代碼 代碼如下:
<frameset cols="150,*">
<frameset rows="80,*">
<frame name="upper_left" src="/a.html">
<frame name="lower_left" src="/b.html">
</frameset>
<frame name="right" src="/c.html">
</frameset>
例子 HTML Code
復制代碼 代碼如下:
<frameset rows="80,*">
<frame name="top" src="/a.html">
<frameset cols="150,*">
<frame name="lower_left" src="/b.html">
<frame name="lower_right" src="/c.html">
</frameset>
</frameset>
例子 HTML Code
復制代碼 代碼如下:
<frameset cols="150,*">
<frame name="left" src="/a.html">
<frameset rows="80,*">
<frame name="upper_right" src="/b.html">
<frame name="lower_right" src="/c.html">
</frameset>
</frameset>
■ <NOFRAMES> ： ▲Top
當別人使用的浏覽器太舊，不支援框架這個功能時，他看到的將會是一片空白。為了避免 這種情況，可使用 <NOFRAMES> 這個標記，當使用者的浏覽器看不到框架時，他就會看 到 <NOFRAMES> 與 </NOFRAMES> 之間的內容，而不是一片空白。這些內容可以是提醒 浏覽轉用新的浏覽器的字句，甚至是一個沒有框架的網頁或能自動切換至沒有框架的版本 亦可。
應用方法：
在<frameset> 標記范圍加入 </NOFRAMES> 標記，以下是一個例子：
復制代碼 代碼如下:
<frameset rows="80,*">
<noframes>
<body>
很抱歉，饋下使用的浏覽器不支援框架功能，請轉用新的浏覽器。
</body>
</noframes>
<frame name="top" src="/a.html">
<frame name="bottom" src="/b.html">
</frameset>
若浏覽器支援框架，那堋它不會理會 <noframes> 中的東西，但若浏覽器不支援框架，由 於不認識所有框架標記，不明的標記會被略過，標記包圍的東西便被解讀出來，所以放在 <noframes>范圍內的文字會被顯示。
■ <IFRAME> ： ▲Top
這標記只適用於 IE。 它的作用是在一頁網頁中間插入一個框窗以顯示另一個文件。它是 一個圍堵標記，但圍著的字句只有在浏覽器不支援 iframe 標記時才會顯示，如<noframes> 一樣，可以放些提醒字句之類。通常 iframe 配合一個辨認浏覽器的 Java Script 會較好，若 javascript 認出該浏覽器並非 Internet Explorer 便會切換至另一版本。
<iframe> 的參數設定如下：
例子：
復制代碼 代碼如下:
<iframe src="iframe.html" name="test" align="center" width="300" height="100" marginwidth="1" marginheight="1" frameborder="1" scrolling="Yes">
src="iframe.html"
欲顯示於此框窗的文件來源除檔案名稱，必要加上相對或絕對路徑。
name="test"
此框窗名稱，這是連結標記的 target 參數所 要的，
align="MIDDLE"
可選值為 left, right, top, middle, bottom，作用不大
width="300" height="100"
框窗的寬及長，以 pixels 為單位。
marginwidth="1" marginheight="1"
該插入的文件與框邊所保留的空間。
frameborder="1"
使用 1 表示顯示邊框， 0 則不顯示。（可以是 yes 或 no）
scrolling="Yes"
使用 Yes 表示容許卷動（內定）， No 則不容許卷動。
例子： 原始碼
復制代碼 代碼如下:
<center> <iframe src="http://www.jb51.net/" name="test" align="center" width="300" height="100" marginwidth="5" marginheight="5" frameborder="1">
很抱歉，饋下使用的浏覽器並不支援 IFrame，不能正常浏覽我的網頁。</iframe>
</center>
顯示結果
多數論壇用的左右的frame代碼－－index.htm如何獲得 frame 的 src 的值~~使用JavaScript實現訪問本站點任何頁面都加載Frame的一種實現方式網頁中框架的動態拉動的控制javascript如何操作框架頁中的域中圖法簡表HTML---Frame分欄的javascript代碼