CSS中,我們可以使用:nth-child偽類來隔行設置表格顏色,以下是一個簡單的示例:
table tr:nth-child(even) { background-color: #f2f2f2; }
在這個示例中,我們選擇了表格的所有偶數行(即隔行),并將它們的背景顏色設置為#f2f2f2,您可以將這個顏色替換為您喜歡的任何顏色。
如果您希望隔兩行或更多行設置顏色,可以使用更復雜的表達式,如果您希望隔兩行設置顏色,可以使用以下代碼:
table tr:nth-child(4n+2) { background-color: #f2f2f2; }
在這個示例中,我們選擇了表格的所有行,但只將偶數行的背景顏色設置為#f2f2f2,這樣,每兩行中只有一行會被著色。
這種方法僅適用于CSS3支持的環(huán)境中,如果您需要支持較舊的瀏覽器,可能需要使用其他方法來實現隔行設置顏色。
版權聲明:除非特別標注,否則均為本站原創(chuàng)文章,轉載時請以鏈接形式注明文章出處。