在CSS中,我們可以使用偽類(pseudo-class)來(lái)選擇元素的奇偶狀態(tài),即n-th child(第n個(gè)子元素),其中n代表數(shù)字。 以下是操作的示例:
/* 選擇所有奇數(shù)行 */ tr:nth-child(odd) { background-color: #f2f2f2; } /* 選擇所有偶數(shù)行 */ tr:nth-child(even) { background-color: #ffffff; } /* 選擇3、5、7、9等奇數(shù)元素 */ li:nth-child(2n+1) { color: red; }
這些樣式將每第二行(第2n行)的背景顏色設(shè)置為灰色并將每第一行(第2n+1行)的字體顏色設(shè)置為紅色。 在選擇器中,可以使用不同的n值來(lái)設(shè)置不同的行或元素
如果要選擇第一個(gè)或最后一個(gè)元素,則可以使用以下代碼:
/* 選擇第一個(gè)元素 */ li:first-child { font-weight: bold; } /* 選擇最后一個(gè)元素 */ li:last-child { font-weight: bold; }
類似地,這些樣式將第一個(gè)和最后一個(gè)元素的字體加粗。 在樣式表中添加這些樣式后,您可以將其應(yīng)用于HTML文檔中的各種元素