手机端点解链接有外框的问题

有的时候,用a作为链接的标签,但是有时在手机出现蓝色外框,很丑,考虑用别的标签代替a 处理此问题。注意,所谓的outline:none是没用的

方案:

1:在a标签里加入js控制,当a标签被聚焦时,强制取消焦点,这时候a标签自然不会有虚线框。

<a href="#" οnfοcus="this.blur();">测试</a>
这里设置聚焦时触发blur();强制取消焦点。

2:在a标签里嵌套其他标签,比如span 或者var等等,把内容放在被嵌套的标签里。这时候点击这个链接,聚焦的是a的子标签,自然不会聚焦在a标签上,所以也能避免这个问题。

3:不适用a标签做链接,采用其他标签,使用js做出hover的效果,在css里加入cursour:pointer;设置鼠标以上时变小手。给用户是链接的错觉。使用js做点击时的页面跳转等。最大的缺点是对seo友好性比前两种差很多。

4  设置-webkit-tap-highlight-color: tranparent;

转载于:https://www.cnblogs.com/FineDay/p/6076858.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值