您可以修改第一列中每个单元格的颜色,而无需修改HTML,方法是将tr上的nth-child和td上的first-child组合在一起,如下所示：
table.agenda tr:nth-child(1) td:first-child {
background: rgb(16,20,50);
color: white;
}
table.agenda tr:nth-child(2) td:first-child {
background: rgb(16,150);
color: white;
}
table.agenda tr:nth-child(3) td:first-child {
background: rgb(16,255);
color: white;
}
现场演示：
table.agenda {
font-family: "Trebuchet MS",sans-serif;
border-collapse: collapse;
width: 100%;
}
table.agenda td,table.agenda th {
border: 1px solid #fff;
padding: 8px;
text-align: center;
}
table.agenda td {
padding-top: 12px;
padding-bottom: 12px;
background-color: rgb(193,174);
color: black;
}
th:nth-child(1) {
background: white;
}
th:nth-child(2) {
background: rgb(72,54);
color: white;
}
th:nth-child(3) {
background: rgb(84,64);
color: white;
}
th:nth-child(4) {
background: rgb(97,73);
color: white;
}
th:nth-child(5) {
background: rgb(110,82);
color: white;
}
th:nth-child(6) {
background: rgb(120,91);
color: white;
}
table.agenda tr:nth-child(1) td:first-child {
background: rgb(16,255);
color: white;
}
August 4August 5August 6August 7August 8
MorningDay 1 MorningDay 2 MorningDay 3 MorningDay 4 MorningDay 5 MorningAfternoonDay 1 AfternoonDay 2 AfternoonDay 3 AfternoonDay 4 AfternoonDay 5 AfternoonEveningDay 1 EveningDay 2 EveningDay 3 EveningDay 4 EveningDay 5 Evening
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
