Html Bootstrap btn 类，但不是悬停状态
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21401767/
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
Bootstrap btn class, but not hover state
提问by Schneider
I know there is .btnclass in bootstrap
我知道引导程序中有.btn类
<span class="btn" style="background-color: #82CFFD"><strong>R</strong></span>
It has nice styling, but is reacting like button, hover state etc, etc. Is there in bootstrap class like .btn but not to have hover state, or we have to make it :(
它有很好的样式，但像按钮、悬停状态等一样反应。在引导类中是否有像 .btn 这样的但没有悬停状态，或者我们必须让它:(
回答by Slavenko Miljic
I think the easiest thing to do would be to add some .nohoverclass to the desired .btnelements that would have the same styles as a .btnclass
我认为最简单的方法是向.nohover所需.btn元素添加一些类，这些元素与.btn类具有相同的样式
HTML
HTML
<span class="btn nohover" style="background-color: #82CFFD"><strong>R</strong></span>
CSS
CSS
.btn.nohover:hover {
/* here copy default .btn class styles */
cursor:default !important;
/* or something like that */
}
回答by styger
The way to achieve what you want is to set your button style, something like btn-default, and then add the activeclass:
实现您想要的方法是设置您的按钮样式，例如btn-default，然后添加active类：
<span class="btn btn-default active" style="background-color: #82CFFD"><strong>R</strong></span>
The only caveat is that the button will always look "pressed." If you don't want the button to look pressed, you'll have to make a custom override.
唯一需要注意的是按钮看起来总是“按下”。如果您不希望按钮看起来被按下，则必须进行自定义覆盖。
回答by TLindig
If you set styles with the attribute style, than this will top all styles set from a css file for the class .btn. So you will not get a hover state style defined in bootstrap css.
如果您使用属性设置样式，那么style这将位于从类的 css 文件设置的所有样式的顶部.btn。所以你不会得到在 bootstrap css 中定义的悬停状态样式。
And since boostrap 3 you have to set a css base class btnand a modifier class btn-defaultor btn-primaryor ...
而且，由于自举3，您必须设置一个CSS基类btn和修饰类btn-default或btn-primary或...
回答by Shivam
.btn:hover {
color: @grayDark;
text-decoration: none;
background-color: darken(@white, 10%);
background-position: 0 -15px;
// transition is only when going to hover, otherwise the background
// behind the gradient (there for IE<=9 fallback) gets mismatched
.transition(background-position .1s linear);
}
you can use hover like this,
你可以像这样使用悬停，
and if you want knowledge about bootstrap and it's functionality, refer this link,
如果您想了解引导程序及其功能，请参阅此链接，
http://jacobrask.github.io/styledocco/styledocco/examples/bootstrap/docs/buttons.html
http://jacobrask.github.io/styledocco/styledocco/examples/bootstrap/docs/buttons.html
回答by cesar andavisa
try this :
尝试这个 ：
<a href="#" class="btn" role="button"><strong>R</strong></a>
you have to make an override of the class .btn from bootstrap
你必须从引导程序覆盖类 .btn
.btn:hover {
background-color : 'your background color';
}
for the cursor there is an example :
对于游标，有一个例子：
http://www.w3schools.com/cssref/playit.asp?filename=playcss_cursor&preval=default
http://www.w3schools.com/cssref/playit.asp?filename=playcss_cursor&preval=default
回答by SerKnight
If you are using sass ( .scss ) you can simply overwrite the style.. I suggest you wrap this in another unique div though, so you don't inadvertently effect ALL .btn classes for future use.
如果您使用 sass ( .scss )，您可以简单地覆盖样式.. 我建议您将其包装在另一个独特的 div 中，这样您就不会无意中影响所有 .btn 类以备将来使用。
.btn {
&:hover {
background-color: #FFF;
}
}
