在我们用手机浏览网页时,当点击某个链接或者点击事件时 会出现一层蓝色半透明的高光显示,

但在开发webapp时,由于网页是被native load去的,在app里面点击的时候如果出现高光则显得很不和谐

css3 的-webkit-tap-highlight-color: rgba(0,0,0,0);的这个属性完美的解决了这个问题

你只去把他放在body里就可以了,通过属性值你可以清晰的知道它所表达的意思 rgba都为0,意思是黑色全透明

这样你点击的时候就不会有蓝色的半透明层了

代码如下:

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

当然你也可以根据自己的需要 比如说你希望点击的时候有灰色半透明层

那么将透明度设置下

body{-webkit-tap-highlight-color: rgba(0,0,0,0.3);}

还可以设置不同的颜色

body{-webkit-tap-highlight-color: rgba(210,10,10,0.3);}

那么这时点击的时候就是一个红色半透明的层

css3 去掉点击高光(移动端)的更多相关文章

  1. 设置UIButton的文字居右显示 去掉点击默认置灰效果

    1.设置UIButton的文字居右显示 [button setContentHorizontalAlignment:UIControlContentHorizontalAlignmentRight]; ...

  2. 基于jQuery CSS3鼠标点击动画效果

    分享基于jQuery CSS3鼠标点击动画效果支持图片或内容滑动,允许设置动画延迟效果.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class="co ...

  3. 移动端H5页面禁止长按复制和去掉点击时高亮

    /*设置IOS页面长按不可复制粘贴,但是IOS上出现input.textarea不能输入,因此将使用-webkit-user-select:auto;*/ *{ -webkit-touch-callo ...

  4. [总结]CSS/CSS3常用样式与web移动端资源

    CSS/CSS3常用样式与知识点 IE条件注释 条件注释简介 IE中的条件注释(Conditional comments)对IE的版本和IE非IE有优秀的区分能力,是WEB设计中常用的hack方法.条 ...

  5. 浅谈css3长度单位rem,以及移动端布局技巧

    rem是什么? rem是css3中新增加的一个单位属性(font size of the root element),根据页面的根节点的字体大小进行转变的单位.root!!!!!!!!!根节点,也就是 ...

  6. css3动画性能优化--针对移动端卡顿问题

    一.使用css,jquery,canvas制作动画 1.Canvas 优点:性能好,强大,支持多数浏览器(除了IE6.IE7.IE8),画出来的图形可以直接保存为 .png 或者 .jpg的图形: 缺 ...

  7. css3的三大特性以及移动端说明

    css3的三大特性: 一.层叠性 所谓层叠性是指多种CSS样式的叠加. 是浏览器处理冲突的一个能力,如果一个属性通过两个相同选择器设置到同一个元素上,那么这个时候一个属性就会将另一个属性层叠掉 比如先 ...

  8. 去掉点击a标签时产生的虚线框

    1.直接给a 标签添加属性:onfocus="this.blur()" 即可 For Example: <a onfocus="this.blur()" ...

  9. WinForm------SimpleButton去掉点击时的边框

    设置属性

随机推荐

  1. 银行HR:寒门再难出贵子

    银行HR:寒门再难出贵子来源:金融行业网 2013 年 8 月 6 日 来源:天涯社区 作者:永乐大帝二世 本文是一位银行的HR写的,他工作了10年,接待了一群到银行实习的实习生,然后观察他们发生的好 ...

  2. javascript之六种数据类型以及特殊注意点

    在js中常见的六种数据类型:String类型.Null类型.Number类型.Boolean类型.Object类型. 1.typeof的注意点 涉及到数据类型,不免会提到,操作符 typeof.要注意 ...

  3. 一次失败的面试——IBM电话面试

    前几天接到IBM的电话面试了,虽然被PASS了,还是发个博记录一下吧.这大概是我第一次比较正式的面试了,虽然只是通过电话,但是还是暴露出了自己的很多问题,总结下,前事不忘,后事之师嘛.:) 一号上午接 ...

  4. Eclipse中创建标准web工程以及标准目录结构说明

    最近公司有个Web项目,项目结构如下: 虽然运行没有错,但是实在是别扭,标准的web应用一般不采用这种结构: 因此总结一下:     1.如何在Eclipse中创建一个标准的Web应用.     2. ...

  5. linux进程管理之服务

     init进程首先通过initable查看运行级别,然后运行rc.d下面的sysinit,然后调用rc,然后运行rc###连接到init.d下面的服务.自启动. chkconfig命令只是查看和设置服 ...

  6. [转载]DateTime TryParse

    今天被Architect问住了,说你光用一个TryParse就判断人家是不是时间日期型的,是不完整的.所以我花点时间看了下TryParse的用法. MSDN:http://msdn.microsoft ...

  7. 【Android自学之旅】 目录

    [Android自学之旅] 目录 [Android自学之旅] Android开发环境的搭建

  8. Unity3D 问题流水总结

    一.error CS1612:Cannot modify a value type return value of `UnityEngine.SliderJoint2D.limits'. Consid ...

  9. WinForm 资源文件的使用

    1. 创建资源文件: 2.双击资源文件,打开如下图:添加一个字符串: 名称为cnnstr 值为-- 3.添加文本文件和图像 4. 调用代码 MessageBox.Show(Resource1.cnns ...

  10. C# 知识笔记

    HttpContext.Request.Form.ToString() 获取Form表单中的内容 /// <summary> /// 获取 GET 提交方式值 /// </summa ...