颜色渐变在Firefox中不起作用

时间:2013-05-28 14:52:26

标签: css css3 firefox

好吧我的问题是在firefox中我的悬停渐变显示为黑到白。黑色为顶部颜色,白色为底部。这是我正在使用的css悬停代码。它对我没有意义,因为我甚至没有使用黑色或白色的颜色代码。任何帮助将不胜感激!

nav a {
color: #fff;
background: #b9b9b9; /* Old browsers */
background: -moz-linear-gradient(top,  #b9b9b9 0%, #616161 99%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b9b9b9), color-stop(99%,#616161)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #b9b9b9 0%,#616161 99%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #b9b9b9 0%,#616161 99%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #b9b9b9 0%,#616161 99%); /* IE10+ */



nav a:hover, nav a:active {
background: #b9b9b9; /* Old browsers */
background: -moz-linear-gradient(bottom, #4f4f4f, #b9b9b9 ); /* FF3.6+ */
background: -webkit-linear-gradient(top,  #b9b9b9 0%,#4f4f4f 99%); /* 
background: -o-linear-gradient(top,  #b9b9b9 0%,#4f4f4f 99%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #b9b9b9 0%,#4f4f4f 99%); /* IE10+ */
background: linear-gradient(to bottom,  #b9b9b9 0%,#4f4f4f 99%); /* W3C */

1 个答案:

答案 0 :(得分:2)

你错过了结束括号。

您的代码无效:http://jsfiddle.net/66QQV/

nav a
{
    color: #fff;
    background: #b9b9b9; /* Old browsers */
    background: -moz-linear-gradient(top,  #b9b9b9 0%, #616161 99%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b9b9b9), color-stop(99%,#616161)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #b9b9b9 0%,#616161 99%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #b9b9b9 0%,#616161 99%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #b9b9b9 0%,#616161 99%); /* IE10+ */
}


nav a:hover, nav a:active
{
    background: #b9b9b9; /* Old browsers */
    background: -moz-linear-gradient(bottom, #4f4f4f, #b9b9b9 ); /* FF3.6+ */
    background: -webkit-linear-gradient(top,  #b9b9b9 0%,#4f4f4f 99%); /* 
    background: -o-linear-gradient(top,  #b9b9b9 0%,#4f4f4f 99%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #b9b9b9 0%,#4f4f4f 99%); /* IE10+ */
    background: linear-gradient(to bottom,  #b9b9b9 0%,#4f4f4f 99%); /* W3C */
}

这假设您打算在<a>元素中放置<nav>元素...如果您认为这是一个类或ID(例如<span class="nav">}或<div id="nav">),您需要分别使用.nav#nav