Html多线表(rowspan) - 如何以正确的方式斑马？
Vin*_*nzz 7 html css html-table
我有下表,第一行包含2个子行,第二行包含3个子行.
这种css风格,斑马颜色(即两个连续行上的交替颜色)有问题,第二个主要单元格应为白色,而不是灰色:
tr:nth-child(odd) {background-color: #eee;}
tr:nth-child(even) {background-color: #fff;}
那么有没有办法以正确的方式将斑马色这样的桌子？
当然,我的真正问题是处理更多行,子行数量变化多得多.
<head>
<style>
tr:nth-child(odd) {background-color: #eee;}
tr:nth-child(even) {background-color: #fff;}
</style>
<head>
<body>
<table border="1">
<tr>
<td rowspan="2">
Big1
</td>
<td>
small1
</td>
</tr>
<tr>
<td>
small2
</td>
</tr>
<tr>
<td rowspan="3">
Big2
</td>
<td>
small1
</td>
</tr>
<tr>
<td>
small2
</td>
</tr>
<tr>
<td>
small3
</td>
</tr>
</table>
</body>
小智 1
它按照设计的方式工作。
它不是作为
<tr>
<td rowspan="2">
Big1
</td>
<td>
small1
</td>
</tr>
将为灰色，这是第一个 TR（奇数）
<tr>
<td>
small2
</td>
</tr>
将为白色，它是第二个 TR（偶数）等。
最好的方法是手动将“奇数”和“偶数”类分配给相关的 tr。
| 归档时间： |
|
| 查看次数： |
3574 次 |
| 最近记录： |