我有一张带班级报告表的表格:
<table class='report-table'>
<thead>
<th>Header</th>
</thead>
<tbody>
<tr >
<td>stuff</td>
</tr>
</tbody>
</table>
我定义了自己的颜色(奇怪的配色方案——但这与我在表格主体中呈现的django表单集有关)
css:
table.report-table {
font-family:arial;
background-color: #DCDCDC;
margin: 10px 5px 15px 15px;
font-size: 10pt;
text-align: center;
width: 1500px;
}
table.report-table thead {
font-family: arial;
border-top: 2px solid black;
border-bottom: 2px solid black;
background-color: #4CAF50;
color: black;
padding: 100px 100px 100px 100px;
font-size: 10.5pt;
font-weight: lighter;
text-align: center;
}
.report-table tbody tr:nth-child(3n+1) td {
background-color: #C0C0C0;
}
.report-table tbody tr:nth-child(3n+2) td {
background-color: white;
}
.report-table tbody tr:nth-child(6n+1) td {
background-color: #d9ffcc;
}
.report-table tbody tr:nth-last-child(3) td {
border-bottom: 1px solid grey;
}
这非常适合我上面的桌子,但有时当我想使用这张桌子时,我想把行涂成橙色。我想把这个添加到我的css文件中:
.orange-row td {
background-color: orange; !important;
text-align:center;
}
然后当我用我的桌子做这个时:
<table class='report-table'>
<thead>
<th>Header</th>
</thead>
<tbody>
<tr class='orange-row'>
<td>stuff</td>
</tr>
</tbody>
</table>
那将是橙色的一排。。。但事实并非如此?为什么不把它推到“前面”呢?我怎样才能让一个类给行加上橙色的背景色呢?