【轉】框架集中framespacing、border和frameborder屬性的關系


一、framespacing和border屬性

我們知道,使用border屬性是設置邊框的寬度的。參考示例:HTML4.01教程:窗口框架設置窗口邊框的粗細示例

同樣,使用framespacing屬性也是設置邊框的寬度的。參考使用framespacing屬性設置框架集邊框寬度

不論單獨使用哪一個屬性,顯示的效果都是一樣的。

而在Dreamweaver中,一旦在“屬性”欄中設置了邊框的寬度,則會同時使用這兩個屬性來表示。代碼如下:

<html>
<head>
<title>框架集中framespacing、border和frameborder屬性的關系示例-baike369.com</title>
</head>
  <frameset cols="40%,*">
  <frame src="append/Frame_a.html" />
    <frameset rows="40%,*" framespacing="50" border="50">
    <frame src="append/Frame_b.html" />
    <frame src="append/Frame_c.html" />
    </frameset>
  </frameset>
  <noframes>
  <body>您的瀏覽器無法處理框架!</body>
  </noframes>
</html>

查看代碼效果:框架集中framespacing、border和frameborder屬性的關系示例

同時使用這兩個屬性和單獨使用任一個屬性,顯示的效果也是一樣的。

在這里,需要注意:

  • 如果framespacing屬性的值不變,而改變borer屬性值的大小,顯示的效果不變。
  • 如果border屬性的值不變,而改變framespacing屬性值的大小,顯示的效果則以framespacing的大小為准。

因此,在框架集中,需要修改邊框的寬度時,應該以framespacing屬性為主。

二、frameborder屬性與framespacing和border屬性

下面來討論frameborder屬性與framespacing和border屬性的關系。

關於frameborder屬性,請參考隱藏窗口邊框。當frameborder="1"時,表示顯示框架的邊框,因為它是默認值,所以不必設置。而當frameborder="0"時,會出現兩種情況:

這里以同時設置framespacing和border屬性為例。當然,單獨使用任一個屬性,效果也是一樣的。

1. 當framespacing和border屬性設置為一個大於0的數時

會出現下面的情況:

<frameset cols="40%,*">
<frame src="append/Frame_a.html" />
<frameset rows="40%,*" framespacing="80" border="80" frameborder="0">
<frame src="append/Frame_b.html" />
<frame src="append/Frame_c.html" />
</frameset>
</frameset>

查看代碼效果:框架集中framespacing、border和frameborder屬性的關系示例(二)

此時,雖然不顯示框架的邊框,但是邊框占據的空間還是存在的。它也會影響網頁的布局。

2. 當framespacing和border屬性設置為0時

會出現下面的情況:

<frameset cols="40%,*">
<frame src="append/Frame_a.html" />
<frameset rows="40%,*" framespacing="0" border="0" frameborder="0">
<frame src="append/Frame_b.html" />
<frame src="append/Frame_c.html" />
</frameset>
</frameset>

查看代碼效果:框架集中framespacing、border和frameborder屬性的關系示例(三)

我們發現,Frame_b.html和Frame_c.html這兩個網頁之間的邊框消失不見了,看上去就像一個網頁一樣。

請分清這兩種情況,然后在網頁制作中,根據具體的情況進行選擇!


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2026 CODEPRJ.COM