按钮内置CSS，在FF和Webkit中显示不同的字体颜色

我被这件事弄糊涂了。我已经构建了一个“阅读更多”按钮，主要使用CSS（如下）。一切正常，但在Firefox中文本显示为白色，而在webkit（safari、chrome）中显示为浅蓝色

以下是CSS：

.showcase-readmore {
float:right;
color:#ffffff;
font:2em Futura, ‘Century Gothic’, AppleGothic, sans-serif;
padding:14px;
background:url(images/overlay.png) repeat-x center #0033cc;
border:1px solid #0033cc;
background-color:rgba(0,51,204,1);
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
border-bottom:1px solid #0033cc;
-moz-box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
}

.showcase-readmore:hover{background-color:rgba(0,51,204,0.6);}

.showcase-readmore:active{position:relative;top:2px;}

以及HTML：

<a class="showcase-readmore" href="services">Read More</a>

这是我在FF中的看法：

和铬：

FF是期望的行为。我唯一的猜测是，透明度不知何故导致白色字体不透明，并与蓝色背景混合

---

我被难住了

对我来说，Firefox和Chrome中的文本都是白色的，所以我很确定CSS的另一部分存在一些问题：link元素上的伪选择器

因为您正在设置此处链接的样式，问题可能是

a:visted

否决了

。showcase readmore

。要解决此问题，请尝试将选择器添加到按钮样式：

.showcase-readmore:link, .showcase-readmore:visited {
   /* ... */
}