frame,iframe,frameset之間的關係與區別

時間 2019-11-09

標籤 frame iframe frameset 之間關係區別欄目 HTML 简体版

原文原文鏈接

■ 框架概念 ：
所謂框架即是網頁畫面分紅幾個框窗，同時取得多個 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> ：

<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

例子 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> ：
當別人使用的瀏覽器太舊，不支援框架這個功能時，他看到的將會是一片空白。爲了不這種狀況，可以使用 <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> ：

這標記只適用於 IE(comet:也使用於FireFox)。它的做用是在一頁網頁中間插入一個框窗以顯示另外一個文件。它是一個圍堵標記，但圍着的字句只有在瀏覽器不支援 iframe 標記時纔會顯示，如<noframes> 一樣，能夠放些提醒字句之類。一般 iframe 配合一個辨認瀏覽器的 JavaScript 會較好，若 JavaScript 認出該瀏覽器並不是 Internet Explorer 便會切換至另外一版本。PS：必定要使用</iframe>關閉，不然後面的內容顯示不出來。瀏覽器