twitter-bootstrap 如何更改按钮悬停属性中的文本颜色
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/27446214/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to change text color in button hover property
提问by Filippo
I used this guide to customize buttons in a web page I've made with bootstrap:
我使用本指南来自定义我用引导程序制作的网页中的按钮:
Change hover color on a button with Bootstrap customization
The problem is that I can't manage to keep the same font-color in hover and I can't explain why it always changes to dark grey. Here's the code: http://codepen.io/anon/pen/ByKZZK
问题是我无法在悬停时保持相同的字体颜色,我无法解释为什么它总是变成深灰色。这是代码:http: //codepen.io/anon/pen/ByKZZK
HTML:
HTML:
<head>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<button href="mailto:[email protected]" class="btn btn-custom btn-lg btn-block">[email protected] <span class="glyphicon glyphicon-envelope"></span></button>
CSS:
CSS:
.btn-custom {
color: #FFD180;;
background-color: #483737;
border-color: #357ebd; /*set the color you want here*/
}
.btn-custom:hover, .btn-custom:focus, .btn-custom:active, .btn-custom.active, .open>.dropdown-toggle.btn-custom {
color: #FFD180;
background-color: #837171;
border-color: #837171; /*set the color you want here*/
}
Any ideas?
有任何想法吗?
采纳答案by DaniP
回答by Rvervuurt
Just add !important;to the color: #FFD180in the hoverpart of your CSS.
只需添加!important;到color: #FFD180在hover你的CSS的一部分。
.btn-custom:hover, .btn-custom:focus, .btn-custom:active, .btn-custom.active, .open>.dropdown-toggle.btn-custom {
color: #FFD180 !important;
background-color: #837171;
border-color: #837171; /*set the color you want here*/
}
Edit: The color (#333) probably comes from this line in the bootstrap.min.css
编辑:颜色(#333)可能来自 bootstrap.min.css
.dropdown-toggle.btn-default{color:#333;background-color:#e6e6e6;border-color:#adadad}

