MozTW 討論區
https://forum.moztw.org/

表格隔行變色的純 CSS 做法
https://forum.moztw.org/viewtopic.php?f=13&t=15482
1 頁 (共 1 頁)

發表人:  wini [ 2006-09-04, 12:10 ]
文章主題 :  表格隔行變色的純 CSS 做法

目前發現到的是有幾種做法…

1. 老實地為 HTML 上 class 再用 CSS 處理
2. 用 JavaScript 搭配 CSS 處理
3. 用好像是 IE Only 的 CSS 語法來處理
4. 用很少瀏覽器支援的 W3C 標準中的方式來處理
5. 全用 HTML 來處理

我用 Google 找「 表格 隔行 TABLE CSS 」是沒找到第四點,所以想請問一下這裡有沒有人知道的?因為我想用 Stylish 來修改網頁樣式這樣。

先謝了。

發表人:  訪客 [ 2006-09-04, 13:01 ]
文章主題 : 

http://www.w3.org/TR/2005/WD-css3-selec ... al-pseudos

不知道 opera 有沒有支援

發表人:  wini [ 2006-09-04, 17:06 ]
文章主題 : 

hemiola 寫:
http://www.w3.org/TR/2005/WD-css3-selectors-20051215/#structural-pseudos

不知道 opera 有沒有支援

不好意思,我雖然嘗試過了,不過好像有點失敗。

我有 Stylish 中寫了:
代碼:
tr.c12[align="right"]:nth-child(even) {
background:blue !important
}


不過Stylish 卻回應我說代碼含有以下錯誤(節錄一部分):
引言回覆:
讀取「 nth-child 」時發生虛擬類別或虛擬元素與預期的型態(函式或非函式)不合的情形。 由於有錯誤的選擇器(Selector)所以略略規則組。


請問這是代表說,我目前的 Fx 1.5.0.6 還不支援的意思嗎?

(另外,我試過 last-child 有成功, first-child 好像失敗了。)

我附了一個測試檔案在附加檔中,有興趣的可以看看。也許是我寫錯了,也許是我的瀏覽器還不支援,總之目前我是看不出來該效果的。

感謝 hemiola 的回應。 :)

附加檔案:
檔案註釋: 測試表格隔行變色的 CSS 用的例子
table_20060904.zip [575 Bytes]
被下載 449 次

發表人:  李某人 [ 2006-09-04, 18:39 ]
文章主題 : 

剛剛用 Opera 9.0 測過了,似乎沒有支援 :nth-child(n) 這個 selector 。

在已知 table 行數的情況下,可以利用 adjacent selector 對 rows 逐一的進行 style ,但這是非常冗長而麻煩的,我想這並不是你想要的方法…。

發表人:  wini [ 2006-09-05, 22:35 ]
文章主題 : 

李某人 寫:
剛剛用 Opera 9.0 測過了,似乎沒有支援 :nth-child(n) 這個 selector 。

在已知 table 行數的情況下,可以利用 adjacent selector 對 rows 逐一的進行 style ,但這是非常冗長而麻煩的,我想這並不是你想要的方法…。

感謝回應。

我的目的只是單純想要讓表格隔行變色,這樣看起來比較不會分不清楚哪一格資料是哪一行的而已。

看來還是要再等 Fx 或 Flock 支援的時候才行呀。

發表人:  風痕影 [ 2006-09-06, 17:36 ]
文章主題 : 

wini 寫:
3. 用好像是 IE Only 的 CSS 語法來處理

您說的是否為 IE 的 Expression?

不過說到 Expression,就讓我想到一種可行的方法
這種方法和 5. 全用 HTML 來處理,以及...
1. 老實地為 HTML 上 class 再用 CSS 處理 很像
卻是由 JavaScript 來代勞,用迴圈跑過表格裡的每一列
自動隔一列加上一個 class (或直接加上樣式) ^^

如果這個表格的頁面是動態產生的話就更方便了
可以在印出 HTML 時自動隔一列加上去 XD

發表人:  wini [ 2006-09-08, 22:35 ]
文章主題 : 

風痕影 寫:
wini 寫:
3. 用好像是 IE Only 的 CSS 語法來處理

您說的是否為 IE 的 Expression?

我用 Google 找「 表格 隔行 TABLE CSS 」時,的確是找到很像在寫 JavaScript 的 expression 語法,我想應該跟你說的是一樣的吧。

總之希望 Fx 也能快點有相關的支援。(汗)

1 頁 (共 1 頁) 所有顯示的時間為 UTC + 8 小時
Powered by phpBB® Forum Software © phpBB Group
https://www.phpbb.com/