一、框架

一個瀏覽器文檔窗口只能顯示一個網頁文件，但是可以通過使用框架，在同一個瀏覽器窗口中顯示不止一個頁面。使用框架的頁面主要包含兩個部分，一個是框架集，另一個就是具體的框架文件。

框架多用于網站后臺或者內網系統的布局。

1.框架集（ frameset /frameset ）：就是用來定義這一HTML文件為框架模式，并設定視窗如何分割的文件。通俗一點地說，框架集就是存放框架結構的文件，也是訪問框架文件的入口文件。如果網頁由左右二個框架組成，那么除了左右二個網頁文件之外，還有一個總的框架集文件。在使用框架的頁面中， body 主體標記被框架標記 frameset 所代替。而對于框架頁面中包含的每一個框架，都是通過 frame 標記來定義的。

rows屬性：水平分割窗口。水平分割窗口是將頁面沿水平方向切割，也就是將頁面分成上下排列的多個窗口。rows中可以取多個值，每個值表示一個框架窗口的水平寬度，它的單位可以是像素，也可以是占瀏覽器的百分比。但是要注意的是，一般設定了幾個rows的值，就需要有幾個框架，也就是需要有相應數量的 frame 參數。

 html  head  title 水平分割窗口的效果 /title  /head  frameset rows= 30%,70%  frame  frame  /frameset  /html 

cols屬性：垂直分割窗口。垂直分割窗口就是將頁面沿垂直方向分割成多個窗口，也就是將頁面分成左右排列的多個窗口。cols中可以取多個值，每個值表示一個框架窗口的水平寬度，它的單位可以是像素，也可以是占瀏覽器的百分比。與水平分割窗口向同，一般設定了幾個cols的值，就需要有幾個框架，也就是有幾個 frame 參數。

 html  head  title 垂直分割窗口的效果 /title  /head  frameset cols= 20%,55%,25%  frame  frame  frame  /frameset  /html 

frameborder屬性：設置邊框。在默認情況下，框架窗口的四周有一條邊框線，通過frameborder參數可以調整邊框線的顯示情況。語法為：

frameset frameborder= 是否顯示 或者 frame frameborder= 是否顯示 。 frameborder的取值只能為0或1。如果取值為0，那么邊框線將會被隱藏；如果取值為1，邊框線將會顯示。在frameset中設置將會對整個框架有效，在frame中設置則只對當前這個框架有效。

 html  head  title 設置框架窗口的邊框顯示效果 /title  /head  frameset rows= 20%,55%,25%  frame frameborder= 1  frameset cols= 35%,65% frameborder= 0  frame  frame  /frameset  frame frameborder= 0  /frameset  /html 

framespacing屬性：框架的邊框寬度。框架的邊框寬度在默認情況下是1像素，通過參數framespacing可以調整其大小。

語法： frameset framespacing= 邊框寬度

說明：邊框寬度就是在頁面中各個邊框之間的線條寬度，以像素為單位。而這一參數只能對框架集使用，對單個框架無效。

 html  head  title 設置框架的邊框寬度 /title  /head  frameset rows= 30%,70% framespacing= 10  frame  frameset cols= 20%,55%,25% framespacing= 30  frame  frame  frame  /frameset  /frameset  /html 

bordercolor屬性：框架的邊框顏色。使用參數bordercolor可以設置框架集的邊框顏色。

語法： frameset bordercolor= 顏色代碼

說明：該參數同樣只對整個框架集有效，對于單個框架無效。

 html  head  title 設置框架的邊框顏色 /title  /head  frameset rows= 30%,70% framespacing= 10 bordercolor = #CC99FF  frame  frameset cols= 20%,55%,25% framespacing= 30 bordercolor = #9900FF  frame  frame  frame  /frameset  /frameset  /html 

2.框架（ frame ）和src屬性。

框架結構中的各個頁面都是一個單獨的文字，而這些文件是通過src參數進行設置的。

語法： frame src= 頁面源文件地址

說明：頁面文件是框架頁面的具體內容的所在，對于沒有設置源文件的框架，只是空白頁面，是沒有任何作用的。頁面的源文件可以是正常的HTML文件，也可以是一個圖片或者其他的文件。

 html  head  title 設置頁面源文件 /title  /head  frameset rows= 30%,70%  frame src= pic01.gif  frame src= src01.html  /frameset  /html 

3. noframes /noframes 標簽

noframes /noframes 標簽用于瀏覽器不支持框架時顯示頁面內容。

 html  frameset cols= 25%,50%,25%  frame src= /example/html/frame_a.html  frame src= /example/html/frame_b.html  frame src= /example/html/frame_c.html  noframes  body 您的瀏覽器無法處理框架！ /body  /noframes  /frameset  /html 

二、浮動框架（ iframe ）

浮動框架是一種較為特殊的框架，它是在瀏覽器窗口中嵌套子窗口，也就是整個頁面并不是框架頁面，但是卻包含一個框架窗口。在框架窗口內顯示相應的頁面內容。浮動框架又叫內聯框架（inline frame），并且因此而得名。

語法： iframe src= 頁面源文件 /iframe

說明：與普通框架結構類似，浮動框架也可以設置很多參數，如 name、scrolling、frameborder等。 但是與普通框架相比，浮動框架中不包含framespacing和bordercolor參數。

src屬性：浮動框架中最基本的參數就是src，它用來設置浮動框架頁面的源文件地址，也是浮動框架頁面必需的參數。因為只有設置了源文件的內容，浮動框架才有意義。語法： iframe src= 頁面源文件

width和height屬性：在普通框架結構中，由于框架就是整個瀏覽器窗口，因此不需要設置其大小。但是在浮動框架中，是插入到普通HTML頁面中的，可以調整整個框架的大小。語法： iframe src= src= 浮動框架頁面源文件 width= 頁面寬度 height= 頁面高度 ，頁面的寬度和高度值都以像素為單位。

 html  body  iframe src= /i/eg_landscape.jpg width= 550 height= 310 /iframe  p 一些老的瀏覽器不支持 iframe。 /p  p 如果得不到支持，iframe 是不可見的。 /p  /body  /html 

三、一個框架布局的示例

 html  head  title 框架主頁面 /title  /head  frameset rows= 20%,* !--框架集，控件文件的容器--  frame name= topFame src= 3.html noresize/  frameset cols= 240px,*  frame name= leftFrame src= 1.html /  frame name= rightFrame src= 2.html marginwidth= 20px scrolling= no /  /frameset  noframes  !--noframes標記當中可以包含body標記--  body  該頁面不支持frameset標簽！ /body  /noframes  /frameset  /html 

四、鏈接如何跳出框架

在網站后臺布局中，框架用得比較多。在很多時候，我們需要跳出框架，重新加載頁面。那么鏈接如何才能跳出框架呢？其實，只需要指定 a /a 標簽的target屬性為 _top 即可實現。下面是一個簡單的例子。

 html  body  p 被鎖在框架中了嗎？ /p  a href= /index.html  target= _top 請點擊這里！ /a  /body  /html 

總結：以上就是本篇文的全部內容，希望能對大家的學習有所幫助。

相關推薦：

對HTML框架標簽的作用總結

HTML框架標簽的實例應用

HTML框架標簽frameset、frame、iframe、noframes

介紹HTML框架(Frames)到底有什么用？

以上就是HTML框架怎么用的詳細內容，html教程

鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。