EN
CSS - style odd elements only
0 points
In this article, we would like to show you how to style odd elements only using CSS.
Quick solution:
xxxxxxxxxx1
li:nth-child(odd) {2
/* style properties here */3
}
In this example, we create an unordered list and style its odd elements using :nth-child(odd); pseudo class.
xxxxxxxxxx1
2
<html>3
<head>4
<style>5
6
li:nth-child(odd) {7
background: yellow;8
}9
10
</style>11
</head>12
<body>13
<ul>14
<li>element 1</li>15
<li>element 2</li>16
<li>element 3</li>17
<li>element 4</li>18
</ul>19
</body>20
</html>