html - 单击按钮显示蓝色矩形。此外，按钮在关闭模式后取消悬停

Question

我在网站的移动版 上出现的号召性用语按钮有两个问题。 首先，蓝色边框出现在按钮周围。我第一次在点击我的按钮时看到这个蓝色边框。是否可以删除它？

其次，按钮在关闭模式后取消悬停。我只需要单击按钮外部即可取消悬停它。

这是页面 http://novostroyka.shahar.uz/complex/citylife

<a href="#" onclick="return false;" class="float2" data-toggle="modal" data-target="#myModal"> 
    <i class="fa fa-phone my-float2" style="font-size:25px;"></i> 
</a>  

@media (min-width:800px) {
.float2{
visibility:hidden;
}
}

@media (max-width:768px) {
.float2{
    position:fixed;
    width:60px;
    height:60px;
    bottom:100px;
    right:27px;
    background-color:#24ac36;
    color:#FFF;
    border-radius:50px;
    text-align:center;
    box-shadow: 2px 2px 3px #999;
    animation: bot-to-top 2s ease-out;
    z-index:1000;
}

.my-float2{ 
    font-size:24px;
    margin-top:18px;
}

.ul2{
    position:fixed;
    right:30px;
    padding-bottom:20px;    
    bottom:65px;
    z-index:100; 
}

.ul2 .li2{
    list-style:none;
    margin-bottom:10px;
}

.ul2 .li2 .a2{
    background-color:#24ac36;
    color:#FFF;
    border-radius:50px;
    text-align:center;
    box-shadow: 2px 2px 3px #999;
    width:60px;
    height:60px;
    display:block;
}

.ul2:hover{
    visibility:visible!important;
    opacity:1!important;
}

.modal-body2{
    position: relative;
    padding: 20px;
}

Answer 1

“蓝色轮廓”可能是为了突出显示按钮已获得焦点或处于事件状态。要删除它，请使用以下代码段:

button,
button:active,
button:focus {
  outline: none;
  -webkit-tap-highlight-color: transparent;
}

您可以将 button 替换为任何相关的 HTML 元素，例如链接的 a, a:active, a:focus { ... } 等。

这将隐藏任何 :focus 大纲(outline: none)，并隐藏智能手机上的 :active 'tap highlight'(-webkit-tap-highlight-color: transparent;) 表示您的按钮在台式机或智能手机上不应再显示蓝色轮廓。

我不太清楚你的第二个问题是什么意思？