如果我使偶数行为红色而第二列为蓝色,则交叉点变为红色。
我正在尝试将整个第二列设为蓝色。
tr:nth-of-type(2n)
{
background: red;
}
col:nth-of-type(2)
{
background: blue;
}
<h1>Make <s>cell 17</s> the whole second column blue</h1>
<p>Even if the table has 9999 other rows, which have cells with random rowspans...</p>
<table>
<colgroup>
<col>
<col>
</colgroup>
<tr><td>1<td rowspan="3">2<td>3<td rowspan="2">4<td>5
<tr><td>6<td>8<td rowspan="2">10
<tr><td>11<td>13<td>14
<tr><td>16<td rowspan="2">17<td>18<td>19<td>20
<tr><td>21<td>23<td>24<td>25
</table>
答案 0 :(得分:4)
更新答案
您可以定位td[rowspan]
以确保所有行窗口都获得背景色。请参阅更新的代码段。
tr:nth-of-type(2n)
{
background: red;
}
td[rowspan] {
background: blue;
}
<h1>Make <s>cell 17</s> the whole second column blue</h1>
<p>Even if the table has 9999 other rows, which have cells with random rowspans...</p>
<table>
<colgroup>
<col>
<col>
</colgroup>
<tr><td>1<td rowspan="3">2<td>3<td>4<td>5
<tr><td>6<td>8<td>9<td>10
<tr><td>11<td>13<td>14<td>15
<tr><td>16<td rowspan="2">17<td>18<td>19<td>20
<tr><td>21<td>23<td>24<td>25
</table>
答案 1 :(得分:2)
最好是选择td
代替tr
并过滤td[rowspan]
。
背景col
将永远留在tr
/ td
/ th
后面。
示例:
tr:nth-of-type(2n) td:not([rowspan])/* if selector do not match, then no background*/
{
background: red;
}
col:nth-of-type(2)
{
background: blue;
}
&#13;
<h1>Make <s>cell 17</s> the whole second column blue</h1>
<p>Even if the table has 9999 other rows, which have cells with random rowspans...</p>
<table>
<colgroup>
<col>
<col>
</colgroup>
<tr>
<td>1
<td rowspan="3">2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td>6</td>
<td>8</td>
<td>9</td>
<td>10</td>
</tr>
<tr>
<td>11</td>
<td>13</td>
<td>14</td>
<td>15</td>
</tr>
<tr>
<td>16</td>
<td rowspan="2">17
<td>18</td>
<td>19</td>
<td>20</td>
</tr>
<tr>
<td>21</td>
<td>23</td>
<td>24
<td>25</td>
</tr>
</table>
&#13;