之前一直没有注意过，为元素设置上cursor:pointer属性后，会导致元素点击时出现一个蓝色的背景。

为元素设置-webkit-tap-highlight-color: transparent;可以解决这个问题。

-webkit-tab-highlight-color是一个不规范的属性(unsupported WebKit property),它没有出现在CSS规范草案中。

当用户点击IOS的Safari浏览器中的链接或JavaScript的可点击元素时，覆盖显示的高亮颜色。

该属性可以只设置透明度，iOS Safari使用默认的透明度，当透明度设为1,元素在点击时不可见。

语法：

-webkit-tap-highlight-color:color；

默认值：inherit

适用于：链接元素比如新窗口打开，img元素比如保存图像等等。

取值：

color:颜色值

transparent:透明值

移动端 cursor:pointer问题的更多相关文章

  1. 移动端/H5关于cursor:pointer导致的问题

    cursor属性规定要显示的光标的类型(形状),该属性定义了鼠标指针放在一个元素边界范围内时所用的光标形状(不过 CSS2.1 没有定义由哪个边界确定这个范围). 不过,这个属性用在PC端没有任何问题 ...

  2. 苹果手机不支持click文字 需要添加 cursor:pointer 才能 识别可以点击

    给一个div 绑定一个 click事件,  苹果手机会识别不了,必须添加一个 cursor:pointer 才能 识别可以点击.安卓正常识别.

  3. cursor:pointer

    .cursor_hand{ cursor:pointer; }

  4. cursor:hand与cursor:pointer的区别介绍

    cursor:hand 与 cursor:pointer 的效果是一样的,都像光标指向链接一样,光标变成手行. cursor:hand :IE完全支持.但是在firefox是不支持的,没有效果. cu ...

  5. input框type=file设置cursor:pointer的问题

    为了让美化上传文件框,设置了cursor:pointer;,然而不起作用,然后百度找到了解决方法,设置font-size:0,这样就可以了.

  6. cursor:hand & cursor:pointer

    1.cursor:hand & cursor:pointer都是将鼠标设置为手形. 2.cursor:hand存在兼容性问题,firefox并不支持该属性值.但大部分主流浏览器支持cursor ...

  7. 横向文本框 cursor:pointer 出现手型

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. cursor: hand和cursor:pointer的区别

    cursor:hand 与 cursor:pointer 的效果是一样的,都像光标指向链接一样,光标变成手行. cursor:hand :IE完全支持.但是在firefox是不支持的,没有效果. cu ...

  9. cursor:pointer的意思

    cursor规则是设定网页浏览时用户鼠标指针的样式,也就是鼠标的图形形状cursor:pointer设定鼠标的形状为一只伸出食指的手,这也是绝大多数浏览器里面鼠标停留在网页链接上方时候的样式另外可以选 ...

随机推荐

  1. rsync远程数据同步工具的使用

    准备工作 虚拟机1: 192.168.24.41, 用于搭建rsync服务器 虚拟机2: 192.168.26.68, 用于搭建rsync客户端 虚拟机1和虚拟机2均为centos7; 1. 检查虚拟 ...

  2. C# join子句

    join 子句可用于将来自不同源序列并且在对象模型中没有直接关系的元素相关联. 唯一的要求是每个源中的元素需要共享某个可以进行比较以判断是否相等的值. 例如,食品经销商可能拥有某种产品的供应商列表以及 ...

  3. ldap数据库--ODSEE--ACI

    查看跟DN下的aci ldapsearch -h hostname -p port -D "cn=Directory Manager" -w - -b "BASE_DN& ...

  4. 14.javaweb AJAX技术详解

    一.简介 1,  ajax:在不重新加载网页的前提下,与服务器交换数据并更新部分网页的技巧,但其本身并不是一种新技术 2,  核心:XMLHttpRequest对象.AJAX技术主要是通过此对象完成的 ...

  5. selenium_Alert

    网页测试,最避免不了的就是弹出框,但是弹出框你真的分的清吗? Alert prompt comfirm 先来认识一下这三个弹窗 代码如下 <!DOCTYPE html> <html ...

  6. [转载] su和sudo

    转载自http://www.cnblogs.com/haichuan3000/articles/2123633.html Mandriva 说也奇怪,用root登录的用户比一般用户还难用,当初用FC6 ...

  7. [转载] HBase vs Cassandra：我们迁移系统的原因

    转载自http://www.csdn.net/article/2010-11-29/282698 我的团队近来正在忙于一个全新的产品——即将发布的网络游戏www.FightMyMonster.com. ...

  8. 【转】jQuery代码片段备用

    在CSDN看到的,记下备用.原文:http://www.csdn.net/article/2013-07-16/2816238-15-jquery-code-snippets-for-develope ...

  9. javascript 的继承

    我们的JavaScript比较特别了,主要通过原型链实现继承的. 下面介绍各种实现继承的方式:原型链继承,借用构造函数,组合继承,原型式继承,寄生式继承,寄生组合式继承. 二.实现继承方式 1.原型链 ...

  10. WinForm 窗体之间相互嵌套

    public FrmScan() { InitializeComponent(); Form1 frm = new Form1(); frm.Dock = DockStyle.Fill; frm.Fo ...