为什么这个嵌套的CSS代码不起作用？

Question

如果我有类似下面的代码，我希望我的链接是大字体的红色，但它不起作用。

.footer {
  text-align: center;
}

.footer a {
  color: red;
  font-size: 32px;
}

实例：http://jsfiddle.net/avUT4/

我不明白。我不擅长CSS，但为什么这段代码不起作用？

Answer 1

.footer a规则前面有一些奇怪的字符。尝试将代码复制到jsbin.com，您会看到它标有红点。从jsfiddle复制时，这种情况发生在我身上。如果删除了char，一切都很好。

Here是你的小提琴，没​​有那个角色。

Answer 2

据我所知，你在某处有垃圾角色。我重写了它，没关系。

.footer
{
 text-align:center;   
}

.footer a
{
 color:red;
 font-size:32px;    
}

http://jsfiddle.net/avUT4/10/

Answer 3

我认为这是jsfiddle中的一个错误。如果你只是定义：

a {
  color: red;
  font-size: 32px;
}

有效。然后，如果你添加.footer（只需在“a”之前输入），它仍然有效，但是当定义“.footer a”时，它将无法从起点开始工作。

Answer 4

试试这个：

.footer {
  text-align: center;
}

.footer a:link, a:active {
  color: red;
  font-size: 120px;
}