边境访问iPhone上的链接

时间:2016-10-04 12:32:51

标签: html ios css border

我正在研究响应式设计。 还有一个问题是我的台式电脑或Android手机上没有。

仅在iPhone上,访问链接上的框周围有黑色边框。 我找不到办法,如何删除那些黑色边框。

在我的屏幕截图中,您可以看到,我的意思。可能有一个特殊的css命令吗?

Comparison

HTML:

<a href="link1.html">
  <div class="col-xs-6 col-md-6 col-lg-4 box menu">
    <div class="opacity"></div>
    <div class="box_bg">
      <i class="fa fa-info"></i><br/>
      infomappe
    </div>
  </div>
</a>
<a href="link2.html">
  <div class="col-xs-6 col-md-6 col-lg-4 box menu">
    <div class="opacity"></div>
    <div class="box_bg">
      <i class="fa fa-credit-card"></i><br/>
      Visitenkarte
    </div>
  </div>
</a>

CSS:

a {
  margin:0;
  padding:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
  -webkit-transition: all .15s linear;
     -moz-transition: all .15s linear;
      -ms-transition: all .15s linear;
       -o-transition: all .15s linear;
          transition: all .15s linear;
}

a:visited, a:focus, a:active {
  text-decoration: none !important;
  outline-color: none !important;
  border: none !important;
}

a:hover{
  text-decoration: none !important;
}

/* Boxes */

.box{
  height:100px;
  text-align: center;
  color: #000;       
  padding: 0;
  overflow: hidden;
}

.box i{
  font-size: 35px;
  padding-bottom:8px;
}

.box_bg{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding-top: 22px;
}
.menu .opacity{
  border: 1px solid #EFEFEF;    
}

0 个答案:

没有答案