Frameset使用教學課程

frame，是網頁開發必須掌握的知識。例如後台架構、局部刷新，頁面分割，都是frame的用途表現，尤其是後台頁面製作，使用frame會為使用者帶來非常舒適的使用感受。

frame知識點包括（frameset標籤、frame標籤、iframe標籤）。下面就對其一一介紹。

一、frameset

1. 屬性

①border

設定框架的邊框粗細。

②bordercolor

設定框架的邊框顏色。

③frameborder

設定是否顯示框架邊框。設定值只有0、1；0 表示不要邊框，1 表示要顯示邊框。

④cols

縱向分割頁。其數值表示方法有三種：「30%、30（或30px）、*」；數值的個數代表分成的視窗數目且數值之間以「,」隔開。 「30%」表示該框架區域佔全部瀏覽器頁面區域的30%；「30」表示該區域橫向寬度為30像素；「*」表示該區域佔用餘下頁面空間。例如：cols="25%,200,*" 表示將頁面分為三部分，左面部分佔頁面30%，中間橫向寬度為200像素，頁面餘下的作為右面部分。

⑤rows

橫向分割頁。數值表示方法與意義與cols相同。

⑥framespacing

設定框架與框架間的保留的空白距離。

2. 使用案例

1：盡量注意1：請嘗試兩不要同在一個標籤中使用。若要實現下圖架構，程式碼正確寫法為：

  

  

    

     【即，若想即使用cols又使用rows，可利用frameset嵌套實現】

注意2：

意思是：第一個框架佔整個瀏覽器視窗的40%,剩下的空間平均分配給另外兩個框架。

意思是：瀏覽器視窗等分為四個部分。

二、frame

1. 屬性

①name

設定框架名稱。此為必須設定的屬性。

②src

設定此框架要顯示的網頁名稱或路徑。此為必須設定的屬性。

③scrolling

設定是否要顯示捲軸。設定值為auto, yes, no。

④bordercolor

設定框架的邊框顏色。

⑤frameborder

設定是否顯示框架邊框。設定值只有0、1；0 表示不要邊框，1 表示要顯示邊框。 ⑥noresize

設定框架大小是否能手動調整。

⑦marginwidth

設定框架邊界和其中內容之間的寬度。

⑧marginhight

設定框架邊界和其中內容之間的高度。

⑨width

設定框架寬度。

⑩height

設定框架高度。

2. 使用案例

三、iframe

是浮動的框架（frame），其常用屬性與frame類似，其他的主要有以下（相同的就不列舉了）

1. 屬性

1.

①align

設定垂直或水平對齊方式

②allowTransparency

設定或取得物件是否可為透明。

2. 使用案例

注意：

iframe標籤與frameset、frame標籤的驗證方法不同，是XHTML 1.0 Transitional。且iframe是放在body標籤之內，而frameset、frame是放在body標籤之外。

四、綜合例子

<p></p> <p></p> <p></p> <p>對不起，您的瀏覽器不支援「框架」！ </p> <p></p> <p></p>