我想选择第 3 个、第 5 个和第 7 个第 n 个孩子的项目
element_name:nth-child(3),element_name:nth-child(5), element_name:nth-child(7)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
h:nth-child(3) {
background-color: red;
color: blue;
}
h:nth-child(5) {
background-color: blue;
color: azure;
}
h:nth-child(7) {
background-color: forestgreen;
color: #000;
}
</style>
</head>
<body>
<h>heading1</h>
<h>heading2</h>
<h>heading3</h>
<h>heading4</h>
<h>heading5</h>
<h>heading6</h>
<h>heading7</h>
<h>heading8</h>
</body>
</html>
以下样式将应用于第 3、5、7、9、11 个元素，依此类推...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
div > p {
font-family: sans-serif;
font-size: 18px;
}
div > p:nth-child(2n+3) {
background-color: yellow;
color: red;
font-weight: bold;
}
</style>
</head>
<body>
<div>
<p>1. Paragraph n=0</p>
<p>2. Paragraph n=1</p>
<p>3. Paragraph n=2</p>
<p>4. Paragraph n=3</p>
<p>5. Paragraph n=4</p>
<p>6. Paragraph n=5</p>
<p>7. Paragraph n=7</p>
<p>8. Paragraph n=8</p>
<p>9. Paragraph n=9</p>
<p>10. Paragraph n=10</p>
<p>11. Paragraph n=11</p>
</div>
</body>
</html>