在工作中常常遇到在手机浏览器中浏览网页时。点击页面中的button或者是具备点击事件的元素，就会出现一个默认的高亮框。影响总体的感官体验。

能够用一个简单的css3属性来解决：tap-highlight-color，最好加上webkit浏览器前缀。

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

-webkit-tap-highlight-color: transparent; /* For some Androids,个人感觉是低版本号的安卓，4.0下面 */

假设你的一大div中包括了非常多小的同类的小div。点击这些小的div要触发事件，你利用事件托付仅仅给外层大的div绑定了点击事件（这样就仅仅要绑定一次就够啦）。那这个属性就会用上，当你点击某个小div时就不会出现整个大div被选中的感觉。

CSS3去除手机浏览器button点击出现的高亮框的更多相关文章

  1. 手机浏览器页面点击不跳转（Android手机部分浏览器） 浏览器双击放大网页 解决

    手机端web网页项目(angluar js 1.4.6) 1,网页项目开发过程中,使用PC浏览器能正常访问,IOS设备浏览器也能正常访问,但是使用Android部分浏览器进行访问的时候,链接偶尔不跳转 ...

  2. 去除手机浏览器input焦点默认边框（直接用outline:none就可以了）

    1.使用Chrome的都知道,当鼠标焦点在input.textarea这些元素上时,Chrome默认的会给它们加上黄色的边框,我以前一直以为这是chrome的特性,没法去掉,原来是css的效果,out ...

  3. css：去掉手机浏览器上点击时的边框和阴影

    outline:none;(去掉蓝框) -webkit-tap-highlight-color:rgba(0,0,0,0) ;(去掉阴影)适用于ios,Android

  4. css3在不同型号手机浏览器上的兼容一览表

    网上搜集了css3对不同系统手机浏览器的支持情况(ios/android/winphone)备份一下以便查看.  以下资料由微信产品部"白树"整理, 转载请注明. √:完全支持   ...

  5. android 点击桌面图标，打开手机浏览器进入对应的站点

    做一个假的adnroid app.要实现点击桌面图标.打开手机浏览器进入对应的站点,实现方法非常easy import android.app.Activity; import android.con ...

  6. css3处理sprite背景图压缩来解决H5网页在手机浏览器下图标模糊的问题

    近期在负责一个微信H5 App项目,遇到一个郁闷的问题,手机浏览器查看网页时图标都是模糊的,有锯齿,电脑浏览器显示则是正常.大概知道是分辨率适配等类型的问题,后来网上查找了一些办法.大部分的解决方式都 ...

  7. 手机浏览器下IScroll中click事件

    产品的h5页面几乎都使用了iscroll插件,如果a标签在iscroll里,在部分手机浏览器中会出现无法点击的情况,不管是绑定click事件还是使用a标签的href属性.href属性偶尔还会能点击,c ...

  8. UC手机浏览器js加入收藏夹

    概述 对于某些网站来说,让用户一键把网页加入收藏夹的设计是非常棒的,它能提醒用户把网页加入收藏夹,从而增加用户的回访率,使网站获得更多的流量. 在PC端,只有ie和ff支持用js把网页加入收藏夹的操作 ...

  9. wp8手机浏览器项目

    项目需求如下: 1.页面布局 最上方为搜索/网址框 中间为网页显示区,默认主页为百度搜索 最下方为功能栏,分别有后退,前进,窗口和更多功能 在更多功能中有 分享给好友 发送网址到桌面 查看历史记录等 ...

随机推荐

  1. ISO7816 (part 1-3) asynchronous smartcard information

    http://java.inf.elte.hu/java-1.3/javacard/iso7816.txt ============================================== ...

  2. MultCloud – 支持数据互传的网盘管理

    MultCloud https://www.multcloud.com/ 是一款在线服务,可以在一个地方管理众多网盘,支持国产百度盘, 最具有特色的地方是你可以直接在 MultCloud 里操作将 D ...

  3. Tasker to proximity screen on

    in my previous entry, i posed an idea how to use the built-in proximity sensor to turn the screen of ...

  4. How to match between physical usb device and its drive letter?

    struct tagDrives { WCHAR letter; WCHAR volume[ BUFFER_SIZE ]; } g_drives[ ]; // WCHAR GetUSBDrive( ) ...

  5. ParseFloat有超长的小数位数的解决

    描述一下sum=parseFloat(num1)+parseFloat(num2),这个个sum=113.32000000000002,最后用了个Math.round(sum* 100)/100,解决 ...

  6. JAVA设计模式之门面模式（外观模式）

    医院的例子 现代的软件系统都是比较复杂的,设计师处理复杂系统的一个常见方法便是将其“分而治之”,把一个系统划分为几个较小的子系统.如果把医院作为一个子系统,按照部门职能,这个系统可以划分为挂号.门诊. ...

  7. STM32学习笔记3-IO配置输入输出

    STM32的IO配置时没什么特殊的,有个注意点就是有用IO前须要先打开其时钟线,下面是验证过oK的程序: RCC->APB2ENR|=GpioBApb2enrEn; //使能PORTB时钟 GP ...

  8. .Net高级技术——结构体

    结构体 结构体和类的区别:结构体是值类型,类是引用类型 结构体非常类似于类,但是值类型(拷贝传递),不能被继承 Int32.DateTime等都是结构体,从ValueType继承,值类型. 结构体测试 ...

  9. ExtJs Ext.data.Store 处理

    var storeCpye = new Ext.data.GroupingStore({ proxy : new Ext.data.HttpProxy({ url : 'cxgl_cpye.app?d ...

  10. SQL游标、函数的使用方法

         游标的的使用有日常的开发和维护的过程不使用的并不多,但是碰到一些棘手的问题的时候,游标时常是个非常好的帮手,下面就说下游标的使用方法,方法自己以后查阅,和加深一些印象,下面以一个存储过程为例 ...