移动端移除链接点击高亮效果

最新推荐文章于 2022-04-21 09:48:38 发布

weixin_34419321

最新推荐文章于 2022-04-21 09:48:38 发布

阅读量359

点赞数

CC 4.0 BY-SA版权

原文链接：https://yq.aliyun.com/articles/572929

本文介绍了一种在移动端浏览器中去除超链接点击高亮效果的方法，通过设置CSS属性-webkit-tap-highlight-color为transparent实现。适用于追求用户体验一致性的移动端网页开发。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在移动端某些浏览器下，超链接点击会有高亮效果。

下面就介绍一下如何移除这个效果。

代码实例如下:

       <!doctype html>
      
       <
       html
       > 
      
       <
       head
       > 
      
       <
       meta 
       charset
       =
       "utf-8"
       > 
      
       <
       meta 
       name
       =
       "author" 
       content
       =
       "http://www.softwhy.com/" 
       /> 
      
       <
       title
       >蚂蚁部落</
       title
       > 
      
       <
       style
       > 
      
       a {
      
       display: inline-block; 
      
       padding: 0 8px; 
      
       line-height: 36px; 
      
       font-size: 16px; 
      
       background: #999; 
      
       color: #fff; 
      
       -webkit-tap-highlight-color: transparent; 
      
       }
      
       </
       style
       > 
      
       </
       head
       > 
      
       <
       body
       > 
      
       <
       a 
       href
       =
       "##"
       >蚂蚁部落欢迎您</
       a
       > 
      
       </
       body
       > 
      
       </
       html
       >