之前一直没有注意过，为元素设置上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. HDU 1074 Doing Homework （状态压缩DP）

    Doing Homework Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)To ...

  2. Ocelot API网关的实现剖析

    在微软Tech Summit 2017 大会上和大家分享了一门课程<.NET Core 在腾讯财付通的企业级应用开发实践>,其中重点是基于ASP.NET Core打造可扩展的高性能企业级A ...

  3. 单元测试框架 unittest 的运行方法if __name__ == '__main__': unittest.main()

    1. if __name__ == '__main__': unittest.main()2. 测试用例实例根据测试的特点分组在一起. unittest为此提供了一个机制:测试套件由unittest' ...

  4. 【WEB API项目实战干货系列】- API访问客户端(WebApiClient适用于MVC/WebForms/WinForm)（四）

    这几天没更新主要是因为没有一款合适的后端框架来支持我们的Web API项目Demo, 所以耽误了几天, 目前最新的代码已经通过Sqlite + NHibernate + Autofac满足了我们基本的 ...

  5. JavaScript系列----数据类型以及传值和传引用

    1.简单数据类型 在JavaScript中简单数据类型分为5种.分别为 Undefined, Null,Boolean,Number,String. Undefined类型Undefined类型只有一 ...

  6. day2--通过setup设置网卡

    配置IP地址,安装完成centos之后,需要配IP地址,流程如下: 1.首先开启虚拟机,如下: 2.登陆账号,root账户登陆,如下: 3.输入setup,按回车键进入,设置IP的方法有很多种,此处采 ...

  7. 用大白话扯扯那"神奇"的面向对象编程思维（一）

    前言: 每当提到面向对象的时候,初学者肯定都是一脸懵逼的状态,到底什么是面向对象?会用面向对象后有什么牛逼之处吗?不会用是不是就会死掉?答案肯定不会死掉,我们可以来简单的举一 个栗子 1.当你想到熊猫 ...

  8. linux操作系统基础篇（三）

    1.cat命令 cat除了可以用来查看文本文档还可以将两个文本文档纵向合并到另外一个文本文档中 比如 cat /etc/passwd /etc/group > 1.txt 2. 归纳了所有的压缩 ...

  9. 【玩转树莓派】使用 sinopia 搭建私有 npm 服务器

    简介 使用 sinopia 的好处是,node系的工程师,内部协作时,使用自有 npm 包,会非常方便:另外,sinopia,会缓存已经下载过的包,可以在相当程度上,加速 npm install 相关 ...

  10. Runtime的理解与实践

    Runtime是什么?见名知意,其概念无非就是"因为 Objective-C 是一门动态语言,所以它需要一个运行时系统--这就是 Runtime 系统"云云.对博主这种菜鸟而言,R ...