试图追踪引导程序悬停效果的来源

我的经理要求我复制引导程序通知的Bootstrap实现。我已经复制下来的HTML和我已经映射了CSS。剩下的一部分是我不确定关闭按钮的悬停效果来自何处。我检查了html并使用了Chrome开发工具。任何想法关闭按钮的悬停效果即将到来，以及如何将效果降至本地实施？试图追踪引导程序悬停效果的来源

http://getbootstrap.com/javascript/#alerts

来源

2016-07-26 user6604655

搜索'CSS文件内.close'：[测距/ CSS/bootstrap.css]（https://github.com/twbs/bootstrap/blob/master/ dist/css/bootstrap.css），你会在＃5851行看到它。 – vanburen

你的意思是这个小'X'在右边？ – Radmation

虽然它在'.close'类中 - 在Chrome中，您可以检查过滤器：hov，这将切换悬停状态，以便您可以看到有效的悬停样式。 – Radmation

为.close类悬停规则位于bootstrap.css文件的行＃5851：

警报悬停CSS查看线路＃5851的dist/css/bootstrap.css

.close:hover, 
.close:focus { 
    color: #000; 
    text-decoration: none; 
    cursor: pointer; 
    filter: alpha(opacity=50); 
    opacity: .5; 
}

工作示例：悬停/焦点颜色和不透明度已更改。

button.close:hover, 
 
button.close:focus { 
 
    color: #f00; 
 
    opacity: 1; 
 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" /> 
 
<div class="alert alert-warning alert-dismissible" role="alert"> 
 
    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span> 
 
    </button> 
 
    <strong>Warning!</strong> Better check yourself, you're not looking too good. 
 
</div> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

来源

2016-07-26 15:54:21 vanburen

试图追踪引导程序悬停效果的来源

回答

相关问题