清除移动端网站点击a标签时闪现的边框或遮罩层（CSS）

　在移动端网站，当你点击加了a标签的文字或图片时，该元素的周围会闪现一个蓝色的边框，在微信上的网站就是如此；而有的浏览器会闪现一个半透明遮罩层，比如移动端的Chrome浏览器，其实这些特效无非就是为了告诉用户已点击了该元素，提升用户体验，但有的时候你会觉得这些特效看起来很别扭，就想着清除它，其实这很简单，只要加上一句CSS就行了。

　　清除所有a标签在点击时出现的特效：

　　a{ -webkit-tap-highlight-color:rgba(255,0,0,0);}

时间： 2024-12-23 22:43:14

清除移动端网站点击a标签时闪现的边框或遮罩层（CSS）的相关文章

点击一个标签时添加一个css，点击另外的标签之前添加的css消失的脚本

页面html: <ul class="m_top"> <li class="m_topli curr" onclick="getList(5216)">兴趣爱好</li> <li class="m_topli" onclick="getList(5213)">自然科学</li> <li class="m_topli" on

点击超链接字段时弹出登录系统DIV层

先给大家来张效果图,点击左上角的登录就会弹出登录系统: 下面跟大家分享下代码,代码复制到HTML文件里面能直接看到效果. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xht

点击弹出居中带有透明遮罩层窗口

点击弹出居中带有透明遮罩层窗口:本章节介绍一下如何点击一个按钮实现弹出一个居中窗口,并且此窗口带有半透明的遮罩层效果,此效果在当下比较流行,当然还有更为复杂的实现方式,当然效果也更为绚丽,下面介绍的代码能够简单实现此效果.代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="htt

最齐全的站点元数据meta标签的含义和使用方法

最齐全的站点元数据meta标签的含义和使用方法随着HTML5的流行和Web技术的不断演变,Meta标签队伍也越来越壮大,从Windows XP的IE6到现在Windows 7.Windows 8的IE9.IE10.IE11,对Html5的支持越来越好.html meta标签的功能作用也越来越强大. 首先.先说一下最初产生的一些经常使用meta标签. 从Meta标签的定义说起. Meta标签是HTML语言中HEAD区的一个辅助性标签,它位于HTML文档头部的<head>标记和<titl

移动端300ms点击延迟和点击穿透问题

一.移动端300ms点击延迟一般情况下,如果没有经过特殊处理,移动端浏览器在派发点击事件的时候,通常会出现300ms左右的延迟.也就是说,当我们点击页面的时候移动端浏览器并不是立即作出反应,而是会等上一小会儿才会出现点击的效果.在移动WEB兴起的初期,用户对300ms的延迟感觉不明显.但是,随着用户对交互体验的要求越来越高,现今,移动端300ms的点击延迟逐渐变得明显而无法忍受. 那么,移动端300ms的点击延迟是怎么来的呢? 问题由来这要追溯至 2007 年初.苹果公司在发布首款 iPho

使用jQuery模拟鼠标点击a标签事件

来源于:https://mo2g.com/view/42/ <html> <head> <meta charset="UTF-8"> <title>磨途歌-A标签测试3</title> </head> <body> <a href="http://www.mo2g.com">磨途歌</a> </body> </html> <scr

手机和PC站点击商务通无轨迹解决方法

手机站点击商务通无轨迹解决方法手机站点击商务通咨询按钮是很多时候会出现后台无法统计到访客的浏览轨迹的情况,这种情况是因为部分手机浏览器打开新的页面不传递来路页面地址信息所导致的.下面为大家介绍一种能解决这一情况的方法: 代码如下 <script type="text/javascript"> function online(){ //商务通轨迹 var e = 'wap'; if(arguments.length == 1){ e = arguments[0]; } if

手机站点击商务通无轨迹解决方法

手机站点击商务通咨询按钮是很多时候会出现后台无法统计到访客的浏览轨迹的情况,这种情况是因为部分手机浏览器打开新的页面不传递来路页面地址信息所导致的.下面为大家介绍一种能解决这一情况的方法: 代码如下: <script type="text/javascript"> function online(){ //商务通轨迹 var e = 'wap'; if(arguments.length == 1){ e = arguments[0]; } if(typeof openZoo

安卓下点击a标签不跳转；点击a标签在手机真机上会调出手机键盘的解决办法

安卓下点击a标签不跳转的解决办法,是不用href做跳转的链接,改为用JS控制跳转 1 <a href="javascript:;" ontouchstart="window.location.href='https://www.baidu.com/'"><img src="xxx"></a> 这样写虽然解决了安卓下点击a标签不跳转的问题,但还是没有解决点击a标签,在手机真机上会调出手机键盘的行为不过将a标签换