javascript – bootstrap 3按钮悬停/焦点状态

前端之家收集整理的这篇文章主要介绍了javascript – bootstrap 3按钮悬停/焦点状态前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
Bootstrap 3的按钮的悬停状态与其焦点状态看起来完全相同.

有没有办法改变这个?我知道这只是一个美容问题,但是当鼠标徘徊时,我希望悬停状态消失,但仍然有另一个明显的功能,知道按钮有焦点.

我不知道这是我的浏览器问题还是真的有意(或者是错误?).

我正在使用Chrome最新版本. (版本34.0.1847.131 m)

链接到Bootstrap 3按钮示例.
http://getbootstrap.com/css/?#buttons-tags

单击标有“输入”的第3个按钮并移出鼠标.

更新:

我已经尝试覆盖默认的焦点/悬停样式,但现在按钮仍然处于焦点状态,即使鼠标悬停在它上面也是如此.有没有办法克服这个?似乎焦点状态在样式中具有比悬停更高的优先级.


感谢指点家伙.
对于仍然具有明显悬停状态但仍处于焦点的预期行为,需要再次重新定义悬停状态.

添加的CSS是这样的:

.btn-default:focus,.btn-default:active,.btn-default.active
{
  background-color: #ffffff;
}

.btn-default:hover
{
  background-color: #ebebeb;
}

解决方法

您可以覆盖引导程序样式.首先确保在bootstrap之后添加样式表或样式声明,例如:
<link rel="stylesheet" href="/stylesheets/bootstrap.min.css">
<link rel="stylesheet" href="/stylesheets/styles.css">

然后在你的CSS中:

.btn:focus {
  background-color: red;
}

猜你在找的JavaScript相关文章