文章目錄
- 顯示所有分隔線 <table rules=all>
- 只顯示組(Groups)與組之間的分隔線 <table rules=groups>
- 只顯示行與行之間的分隔線 <table rules=rows>
- 只顯示列與列之間的分隔線 <table rules=cols>
- 不顯示任何分隔線 <table rules=none>
- 顯示所有 4 個邊框 <table frame=box>
- 只顯示上邊框 <table frame=above>
- 只顯示下邊框 <table frame=below>
- 只顯示上、下邊框 <table frame=hsides>
- 只顯示左、右邊框 <table frame=vsides>
- 只顯示左邊框 <table frame=lhs>
- 只顯示右邊框 <table frame=rhs>
- 不顯示任何邊框 <table frame=void>
由於這兩天看drupal遇到一些介面的問題，順便看了一些html，table的一些屬性。
下面是轉自新浪部落格一位網友的總結。
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－
<table>的屬性：1.border=表格邊框，2.width,height表格的寬、高3.cellspacing儲存格之間的距離。4.cellpadding表格內部與文本的距離。5.algin表格相對網頁的位置6.<caption>..</caption>表格標題的位置。 algin=left/right左/右 valgin=top/bottom上/下7.brodercolor表格邊框顏色。8.borercolorlight表格亮面顏色(左、上)bordercolordark表格暗面顏色（右、下）表格的這些屬性都很簡單，只要使用一下就都明白了。<tr>的屬性bgcolor一行的背景顏色。algin/valgin行的水平對齊和垂直對齊。<td>的屬性bgcolor一列的背景顏色。rowspan/colspan儲存格所佔行數/儲存格所佔列數algin/valgin和<tr>中的是一樣的。 下面是幾個特出的屬性，很多精彩的表格都是利用這些屬性完成的。1.ruels儲存格之間的特效。表格中分隔線(Rules)的顯示
顯示所有分隔線 <table rules=all>
<table border rules=all> <colgroup><col align=center span=2> <colgroup align=right> <thead> <tr><th>Food</th><th>Drink</th><th>Sweet</th> </thead> <tbody> <tr><td>A</td><td>B</td><td>C</td> <tr><td>D</td><td>E</td><td>F</td> </tbody> <tbody> <tr><td rowspan=3 align=right>Total $-00.0</td> </tbody> </table>
| Food |
Drink |
Sweet |
|
| A |
B |
C |
| D |
E |
F |
|
| Total $-00.0 |
|
只顯示組(Groups)與組之間的分隔線 <table rules=groups>
| Food |
Drink |
Sweet |
|
| A |
B |
C |
| D |
E |
F |
|
| Total $-00.0 |
|
只顯示行與行之間的分隔線 <table rules=rows>
| Food |
Drink |
Sweet |
|
| A |
B |
C |
| D |
E |
F |
|
| Total $-00.0 |
|
只顯示列與列之間的分隔線 <table rules=cols>
| Food |
Drink |
Sweet |
|
| A |
B |
C |
| D |
E |
F |
|
| Total $-00.0 |
|
不顯示任何分隔線 <table rules=none>
| Food |
Drink |
Sweet |
|
| A |
B |
C |
| D |
E |
F |
|
| Total $-00.0 |
|
2.frame屬性，設定表格外邊框特效表格中邊框的顯示
顯示所有 4 個邊框 <table frame=box>
<table border frame=box> <thead> <tr><th>Food</th><th>Drink</th><th>Sweet</th> </thead> <tbody> <tr><td>A</td><td>B</td><td>C</td> <tr><td>D</td><td>E</td><td>F</td> </tbody> </table>
| Food |
Drink |
Sweet |
|
| A |
B |
C |
| D |
E |
F |
|
只顯示上邊框 <table frame=above>
| Food |
Drink |
Sweet |
|
| A |
B |
C |
| D |
E |
F |
|
只顯示下邊框 <table frame=below>
| Food |
Drink |
Sweet |
|
| A |
B |
C |
| D |
E |
F |
|
只顯示上、下邊框 <table frame=hsides>
| Food |
Drink |
Sweet |
|
| A |
B |
C |
| D |
E |
F |
|
只顯示左、右邊框 <table frame=vsides>
| Food |
Drink |
Sweet |
|
| A |
B |
C |
| D |
E |
F |
|
只顯示左邊框 <table frame=lhs>
| Food |
Drink |
Sweet |
|
| A |
B |
C |
| D |
E |
F |
|
只顯示右邊框 <table frame=rhs>
| Food |
Drink |
Sweet |
|
| A |
B |
C |
| D |
E |
F |
|
不顯示任何邊框 <table frame=void>
| Food |
Drink |
Sweet |
|
| A |
B |
C |
| D |
E |
F |
|
3.fiedset特殊表格。<html><head><body><table width="200"><tr><td><fieldset style="width:200" align="center">
<legend><table style="border: 1 solid #000000" width="80" cellspacing="1"
cellpadding="0" height="20"><tr><td><font color=blue>無憂IT網</font></td></tr></table></legend><br></fieldset></td></tr></table></body>可以運行下這個代碼就知道是怎麼個特殊了。4.legnd在fieldset標籤建立特殊表格產生頭資訊。<table width="200"" cellspacing="0"
cellpadding="0">
<tr>
<td>
<fieldset style="width:
200; color: #B7B7B7; border-style: groove" align="center">
<legend
style="color: blue; border: 1 solid #000000">
表中表效果Ⅰ</legend>
<br>
</fieldset>
</td>
</tr>
</table>運行下例子就知道效果了，表格的東西真多。麻煩
