我是否需要指定每个链接的颜色状态？

Question

我用下面的伪类：

a.recentposttitle:link,a.recentposttitle:visited {color:#000;} 
a.recentposttitle:hover {color:#56A49F;} 
a.recentposttitle:active {color:#000;} 

我需要是明确的或者是有一个更压缩的方式来获得同样的结果？

Answer 1

CSS中没有用于锚点/链接伪类的简写选择器。所以你所拥有的就像你所能得到的那样简洁。

W3 Link Training

a:link{ Declarations } 
a:visited{ Declarations } 
... 
a:hover{ Declarations } 
a:active{ Declarations } 

Answer 2

我需要找到我以前读证实了这一点参考，但据我所知，在:link伪选择是只需要如果您使用的旧式页面锚（<a name="..."></a>） ，所以你应该能够安全地消除这种情况。由于您的:active和:visited规则是一样的，你很可能降低您已经证明这是什么：

a.recentposttitle:active, a.recentposttitle:visited {color:#000;} 
a.recentposttitle:hover {color:#56A49F;} 

但你没有真正节省很多字节，所以很难说，如果这是值得的。

Answer 3

不，没有简写。但是，你的选择可能是：

a {} 

选择所有links，或：

.recentposttitle {} 

让所有.recentposttitle元素（我们知道他们是链接的话）。

---

而另一件事，:link不需要真的，你可以这样写：

a {} 
a:visited {} 
a:hover {} 
a:active {} 

当你写a {}，您将设置申报所有可能的情况，所以：

a {} 

完全相同：

a:link, a:visited, a:hover, a:active {} 

• 记住，的pseudo classes顺序是importent：
  • ：升墨
  • ：v isited
  • ：ħ超过
  • ：一个莫如
• 或请记住L o V e HA te。

Answer 4

您可以使用CSS框架来压缩它，如LESS或SASS。

从你的例子一样，

的CSS：

a.recentposttitle:link,a.recentposttitle:visited {color:#000;} 
a.recentposttitle:hover {color:#56A49F;} 
a.recentposttitle:active {color:#000;} 

例如，如果您使用SASS可以压缩到..

a.recentposttitle { 
    color: #000; 
    &:link{ color: #000; } 
    &:hover { color: #56A49F; } 
    &:visited { color: #000; } 
    &:active{ color: #000; } 
} 

你也可以使用Emmet，以前称为Zen coding用于最大代码压缩秒。

希望这会有所帮助。