Question

我的桌子有一个外部CSS。它有交替的阴影行。我希望一个表格单元格具有绿色背景和红色字体。另一个细胞有红色背景与绿色写作。但它只会采用第一个ID。如果我首先放置红色背景，那将显示但不显示绿色。如果我先放置绿色背景，那将显示但不显示红色。

tr:nth-child(odd) {background: #FFF}
tr:nth-child(even) {background: #CCC}
table,th,td
{
border:1px solid black; text-align:center;
}

 #worst {font-style:bold; background-color: red; color:green };
 #best  {font-style:bold; background-color: green; color:red };

HTML

<tr>
  <td>Hummer</td>
  <td>290</td>      
  <td>115</td>
  <td ID="worst">405</td>
 </tr>
<tr>
  <td>Bike</td>
  <td>0</td>        
  <td>5</td>
  <td ID="best">5</td>
 </tr>

这是外部CSS的属性还是其他错误？

Answer 1

这里的问题有点微妙，请看这些代码行末尾的分号？

#worst {font-style:bold; background-color: red; color:green };
#best  {font-style:bold; background-color: green; color:red };

那些不应该在那里。发生了什么事情，当你把分号放在原来的地方时，CSS解析器会尝试读取它。但这是一个语法错误，因此它会跳过其余代码，因为它假定它无效。

Answer 2

分号应位于}内，而不在其外。您正在创建无效的选择器;\n #best
（\n当然是换行符！）

两个外部CSS ID，但只有第一个工作

2 个答案: