2008/10/31

COL, COLGROUP

COL 可以用來設定報表(TABLE)中的一個直欄的共同屬性。COL 可以直接用在 TABLE 中。也可放在 COLGROUP 中,COL 會改寫 COLGROUP 設定的屬性值。部份瀏覽器沒有完整支援此功能。只有 SPAN, WIDTH 兩個屬性有完整的支援。

COLGROUP 可以用來設定報表(TABLE)中的數個直欄(預設值為 1)的共同屬性,可用 SPAN 屬性宣告直欄數。COLGROUP 必須直接接在 CAPTION 之後,且在 THEAD 之前。COLGROUP 區塊中可放 COL,COL 會改寫 COLGROUP 設定的屬性值;用了 COL,就不能用 SPAN。部份瀏覽器沒有完整支援此功能。

屬性說明
ALIGN | BGCOLOR | CHAR | CHAROFF | SPAN | VALIGN | WIDTH
通用屬性

此元件可以使用通用屬性,請參考通用屬性的說明。

  • 上例中的 color:red, font-size:180% 與 text-align:center,只有 IE 成功執行;Firefox, Safari, Chrome 都沒支援。但是 background:blue 則都有支援。使用時最好多測試一下。
  • 前面的說明是作者在個人電腦離線測試的結果;移到部落格之後,IE6 還有支援,但IE8 只有 background 被成功執行。
ALIGN

設定資料在方格中對齊的方法。可設為:
  1. left:資料對齊方格的左邊。此為預設值。
  2. center:資料展現於方格的中央。此為表頭的預設值。
  3. right:資料對齊方格的右邊。
  4. justify:兩邊對齊。
  5. char:資料依據指定的字對齊。
  • 上例中的 align 測試,只有 IE 成功執行;Firefox, Safari, Chrome 都沒支援。
  • 前面的說明是作者在個人電腦離線測試的結果;移到部落格之後, IE6 成功,IE8 失敗。
BGCOLOR

設定背景顏色。IE 的三碼顏色 #RGB 會轉換成 #0R0G0B;Firefox, Safari, Chrome 則轉換成 #RRGGBB。建議用 六碼顏色值(#RRGGBB)。

  • 上例中的 bgcolor 測試,IE, Safari, Chrome 都成功;Firefox 沒支援。在 Firefox 必須使用 style 的 background 設定背景色。建議改用 background 才能通用於主要瀏覽器。
CHAR

當 align='char' 時,用來宣告直欄的對齊字。預設值,在英語為數字的小數點『.』,法語則為『,』。主要瀏覽器都沒有支援。

CHAROFF

設定距離第一個對齊字的長度,單位可用像素或百分比。主要瀏覽器都沒有支援。

SPAN

宣告數個直欄,使用 COL 設定的屬性值。預設值為 1。

VALIGN

指定資料放置在方格中的垂直位置。可設為:
  1. top:資料放在方格上方。
  2. middle: 資料放在方格的垂直中央。此為預設值。
  3. bottom:資料放在方格的底部。
  4. baseline:資料的第一行(只有第一行)文字行,要放在同一橫列的基準線上。
  • 上例,IE 執行成功;Firefox, Safari, Chrome 沒有支援。
WIDTH

設定直欄的寬度,可以是:
  1. 用像素值(pexel):例如 100px。
  2. TABLE 寬度的百分比:例如 15%。
  3. n*:表示平均直欄寬的 n 倍。主要瀏覽器都沒有支援。

測試 n*。


©2008-2009 by ant2legs, All Rights Reserved. ant2legs 擁有其製作的文章,圖片與程式的著作權,所有權利保留。