我正在参加一个不太好的在线类(class),现在我可以依靠的人通常也找不到问题的帮助。
在我的 <style>
标签,我设置所有<td>
标记为 background-color:#7A7A7A;
啊...现在正在显示 tr.whiteback
应显示为 background-color:#FFFFFF;
的 CSS 设置
这是整个代码文件,显示了放在 Pastebin 中的整个结构
结果:
期望的效果:“Class Times”行应该有白色背景,但它有其他数据单元格的灰色背景,这是我不想要的。
最佳答案
让我失望的是你在受影响行的第一个 td 上有 class="whiteback"
。这告诉我,作为一名代码阅读者,你只是想把那个变成白色,而让另一个 tds 变成灰色。
如果您的目标只是在行上使用“whiteback”类来覆盖 td 样式,那么您只需要为您的选择器添加一些额外的特异性。
我在第一个 td 上取消了 class="whiteback"
因为你似乎不需要它(不确定你在那里做什么) - 我只是改变了你的 CSS 来选择.whiteback td
以及 .whiteback
。
.whiteback, .whiteback td {
background-color:#FFFFFF;
}
<!DOCTYPE html>
<html lang="en">
<head>
<title>Stylish Schedule Assignment</title>
<style>
table {
border:solid;
border-color:#2A2A2A;
color:#000000;
background-color:#3A3A3A;
margin:5px;
}
.red16 {
color:#FF0000;
font-size:16px;
}
.blue16 {
color:#0000FF;
font-size:16px;
}
.green18 {
color:#00FF00;
font-size:18px;
}
.whiteback, .whiteback td {
background-color:#FFFFFF;
}
td {
background-color:#7A7A7A;
}
th {
background-color:#FFFFFF;
}
tr.whiteback {
background-color:#FFFFFF;
}
</style>
</head>
<body>
<table>
<caption class="whiteback">Schedule</caption>
<tr>
<th>Blocks</th>
<td>A block</td>
<td>B block</td>
<td>C block</td>
<td>D block</td>
</tr>
<tr>
<th>Class</th>
<td>Vocational School</td>
<td>Vocational School</td>
<td>Online Course</td>
<td>Creative Writing</td>
</tr>
<tr>
<th>Grade</th>
<td class="blue16">89</td>
<td class="blue16">89</td>
<td class="green18">94</td>
<td class="red16">79</td>
</tr>
<tr class="whiteback">
<th>Class times</th>
<td colspan="2" style="text-align:center;">7:45 - 10:15</td>
<td>10:45 - 12:00</td>
<td>12:00 - 1:15</td>
</tr>
</table>
</body>
</html>
关于html - 全局 <td> 标签在后台写入 <tr> 标签中指定的类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58790839/