字体颜色不会改变悬停

问题描述：

我有这样的登录按钮，看起来像这样：字体颜色不会改变悬停

现在，当我将鼠标悬停于它，它应该是这样的：

我不能让文字白当我将鼠标悬停在上面

我的代码：

.button { 
 
\t border: 0px solid #011f4b; 
 
\t background: #011f4b; 
 
\t padding: 3px 21px; 
 
\t -webkit-border-radius: 16px; 
 
\t -moz-border-radius: 16px; 
 
\t border-radius: 16px; 
 
\t color: #ffffff; 
 
\t font-size: 12px; 
 
\t font-family: Questrial; 
 
\t text-decoration: none; 
 
\t vertical-align: middle; 
 
\t letter-spacing: 2px; 
 
    } 
 
    
 
    .button:hover { 
 
\t border: 0px solid #1292e1; 
 
\t background: #1292e1; 
 
\t color: white; 
 
    } 
 
    
 
    .button:active { 
 
\t background: #1292e1; 
 
\t color: #fff; 
 
    }

<a href='#' class='button'>Login</a>

您将两种颜色都设为白色 –

@TemaniAfif你是什么意思？ –

我的意思是你把白色和它是白色的...你的代码中的问题在哪里？ –

答

尝试添加一个标签在你的选择，以避免conlict与其它CSS，你可能在你的网站：

a.button { 
 
    border: 0px solid #011f4b; 
 
    background: #011f4b; 
 
    padding: 3px 21px; 
 
    -webkit-border-radius: 16px; 
 
    -moz-border-radius: 16px; 
 
    border-radius: 16px; 
 
    color: #ffffff; 
 
    font-size: 12px; 
 
    font-family: Questrial; 
 
    text-decoration: none; 
 
    vertical-align: middle; 
 
    letter-spacing: 2px; 
 
} 
 

 
a.button:hover { 
 
    border: 0px solid #1292e1; 
 
    background: #1292e1; 
 
    color: white; 
 
} 
 

 
a.button:active { 
 
    background: #1292e1; 
 
    color: #fff; 
 
}

<a href='#' class='button'>Login</a>

你也可以考虑！重要强迫ke eping这样的白色：

a.button:hover { 
     border: 0px solid #1292e1; 
     background: #1292e1; 
     color: white!important; 
    }

没有工作：（（ –

你能够显示为网站？ –

你可能会考虑在悬停部分添加**！重要的** –

答

尝试添加！ !important如果有另一个css代码将颜色设置为另一个css代码，将强制颜色变为白色

字体颜色不会改变悬停

相关推荐