當我迭代集合時,是否有可能僅使用CSS爲動態生成的表格設置奇數行和偶數行上的不同樣式,而無需在每行上設置正確樣式?奇數和偶數行上的不同CSS樣式
回答
我不知道這會工作的跨瀏覽器使用jquery,我寧願jQuery的自己,但CSS-只有這應該做的伎倆:
tr:nth-child(even) { ... }
tr:nth-child(odd) { ... }
嗯,這是跨瀏覽器的瀏覽器不吸吮... – 2011-02-23 23:13:03
您可以使用nth-child
選擇器http://reference.sitepoint.com/css/pseudoclass-nthchild,儘管它不受所有瀏覽器支持。
您也可以作爲描述What is the best way to style alternating rows in a table?
這是'nnth-child' ... =) – 2011-02-23 20:18:03
哎呦,感謝您的支持,感謝 – 2011-02-23 22:04:51
你可以用CSS3做到這一點。
tr:nth-child(2n+1) /* targets all odd rows */
tr:nth-child(2n) /* targets all even rows */
,你可以簡單地使用jQuery和喜歡
$("tr:nth-child(odd)").addClass("odd");
和樣式使用CSS將其添加類奇數行作爲
.odd{background-color:#657383}
- 1. GVim:奇數行和偶數行的不同顏色
- 2. css奇數和偶數嵌套元素
- 3. 奇數偶數和
- 4. 爪哇,偶數偶數,奇數奇數
- 5. Div奇數和偶數
- 6. 奇數和偶數排隊
- 7. 不同顏色的矩形(偶數/奇數行)
- 8. 在奇數和偶數行加載兩個不同的Json數據 - ngGrid- AngularJs
- 9. 添加不同類偶數和奇數的div
- 10. 如何將樣式應用於表中的偶數行或奇數行?
- 11. 偶數和奇數的數組
- 12. 檢查指數的奇數和偶數
- 13. 計算偶數和奇數的數量
- 14. pl/sql偶和奇數塊
- 15. 我怎樣才能讓奇數和偶數的表格行的懸停階段
- 16. 偶數和奇數的流程圖
- 17. 偶數和奇數的C++循環
- 18. 奇數和偶數計數器
- 19. 樣式奇數和偶數同級元素 - 不包括那些設置爲顯示:無
- 20. Python - Numpy:我怎樣才能同時選擇一個數組的所有奇數行和所有偶數列
- 21. PHP循環,偶數/奇數行返回
- 22. 在具有不同奇偶
- 23. 而程序顯示偶數和奇數
- 24. 重新排列奇數和偶數
- 25. JTransforms FFT:偶數和奇數之差
- 26. 反向加偶數和奇數組
- 27. 按順序排列偶數和奇數
- 28. 使輸出成奇數和偶數?
- 29. 偶數和奇數while循環在PHP
- 30. scala:將屬性(奇數行和偶數行)添加到xml表
看到這裏的'第n-child'示範答案:http://stackoverflow.com/questions/5080699/using-css-even-and-odd-pseudo-selectors-with-list-items – thirtydot 2011-02-23 20:10:01
你不應該混淆Java和JavaScript(它被重新授權給你)。請參閱:http://stackoverflow.com/questions/245062/whats-the-difference-between-javascript-and-java – thirtydot 2011-02-23 20:16:09
jQuery的+1,它存在的一個原因,真的沒有任何有效的理由不使用它如果你使用JavaScript開始。 – 2011-02-24 03:01:45