javascript - 全局颜色不透明度悬停覆盖？

Question

我正在使用下面的全局链接不透明度覆盖。

a:hover {
    text-decoration: none;  opacity: 0.6; /* css standard */
    filter: alpha(opacity=60); /* internet explorer */
} /* mouse over link */

我怎样才能为此添加颜色？这可能与 CSS 或我只看 JS / jQuery 解决方案？

Answer 1

a:hover{
    /* your stuff here */
    color:#f00;                // older browsers
    color: rgba(255,0,0,0.4);  // browsers with rgba support (r,g,b,alphaOpacity)
}

Answer 2

如果您希望将颜色（例如黑色）放在背景上，那么您的代码将是

a:hover {text-decoration: none;  opacity: 0.6; /* css standard */
filter: alpha(opacity=60); /* internet explorer */ /* mouse over link */ background: #000; }

如果您希望 a 标签的颜色为黑色，那么您的 css 将如下所示

a:hover {text-decoration: none;  opacity: 0.6; /* css standard */
filter: alpha(opacity=60); /* internet explorer */  /* mouse over link */ color: #000; }

}出于某种原因，您的代码中有额外的内容。

Answer 3

看来您根本不需要不透明度。您正在搜索的效果是透明背景。rgba()与后备一起使用rgb()并改为定义透明背景。

a:hover {
    text-decoration: none;  
    background: rgb(255,0,0) /* fallback */
    background: rgba(255,0,0,0.6) /* red with 60% opactiy */
    color: #000;
}