好的,我将完整的代码粘贴给你 <div class="table" style="overflow-y: auto; height:15em; width:100%"> <table border="0" width="100%" height="16em" cellpadding="4.8" align="center"> <tr> <th>行政区划</th> <th>预警项目数</th> <th>已处置数</th> <th>未处置数</th> </tr> <tr> <td>杭州市</td> <td>216</td> <td>28</td> <td>2</td> </tr> <tr> <td>宁波市</td> <td>216</td> <td>28</td> <td>2</td> </tr> <tr> <td>湖州市</td> <td>216</td> <td>28</td> <td>2</td> </tr> <tr> <td>衢州市</td> <td>216</td> <td>28</td> <td>2</td> </tr> </table> </div> <style> table{ border-collapse:collapse; } table th{ color: #fff; font-size: 16px; height:20px; line-height: 20px; text-align: center; } table tr{ /* border: 1px solid red; */ color: rgb(220, 235, 251); height:40px; line-height: 40px; text-align: center; } table tr:nth-child(2n+3) td{ background: rgba(1, 154, 254, 0.1); //不同行换色 border: 1px solid red; } table td{ text-align: center; } </style>
时间: 2023-08-14 10:05:52 浏览: 151
我注意到您在代码中设置了表格样式和边框样式。我发现一个问题是,您在设置表格样式时使用了 `border-collapse: collapse;`,这会导致表格的边框合并在一起,使得 `table tr:nth-child(2n+3) td` 中的边框样式无法正常显示。
解决这个问题的方法是,将 `border-collapse` 属性设置为 `separate`,以便单独显示每个单元格的边框。请尝试将以下代码添加到您的样式中:
```css
table {
border-collapse: separate;
}
```
在添加了此代码后,您应该能够在 `table tr:nth-child(2n+3) td` 中正确显示边框样式了。如果还有其他问题,请随时告诉我。
阅读全文