`
zhangyaochun
  • 浏览: 2613930 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

-webkit-tap-highlight-color

阅读更多

-webkit-tap-highlight-color

 

 

   -----这个属性只用于iOS(iPhone和iPad)。

 

 

  • 当你点击一个链接或者通过js定义的可点击元素的时候,就会出现一个半透明的灰色背景。

 

  • 当然如果想要禁用高亮,设置颜色的alpha值为0
 
/*设置高亮为50%的透明红*/
-webkit-tap-highlight-color:rgba(255,0,0,0.5);
 

 扩展阅读:

 

http://www.cnblogs.com/radom/archive/2012/04/19/2457356.html

 

分享到:
评论

相关推荐

    浅析CSS3中鲜为人知的属性:-webkit-tap-highlight-color

    其中之一就是`-webkit-tap-highlight-color`属性。这个属性主要用于移动设备,特别是iOS的iPhone和iPad,它允许开发者自定义用户点击元素时产生的高亮效果。 `-webkit-tap-highlight-color`的作用是设置在触摸设备...

    去除手机网页点击阴影

    一般做的手机网页在android手机上点击div或者按钮时,点击区都会出现一块令人讨厌的阴影块,想去掉吗,想的话就下载吧

    基于Webkit的Web开发

    `-webkit-scrollbar`等属性可以自定义浏览器的滚动条样式,`cursor`定义鼠标指针形状,`-webkit-tap-highlight-color`控制元素在触屏设备上被点击时的高亮颜色。 通过这些WebKit特有的CSS扩展,开发者能够实现更为...

    CSS Reset 样式重置的实现示例.pdf

    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-overflow-scrolling: touch; overflow-scrolling: touch; height: 100%; } body { background: #fff; font: 14px -apple-system BlinkMacSystemFont...

    CSS去除移动端点击时元素产生的背景色 (推荐)

    首先,我们可以使用`-webkit-tap-highlight-color`这个CSS属性来控制元素在被触摸时的高亮颜色。这个属性仅在Webkit内核的浏览器(如Safari和Chrome for Android)中有效,但大多数现代移动设备都支持它。将其设置为...

    ios输入框(input)背景色为白色无法去除.pdf

    -webkit-tap-highlight-color: rgba(0,0,0,0); } 注意:如果在使用了上述第二段代码后,iOS的异常还是没有解决,可以检查自己的input标签中,是否写着type="search",因为这一段代码会使得输入框具有默认样式。...

    移动端开发资料1

    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } ``` 而Windows Phone系统中,类似的效果可以通过`<meta>`标签处理: ```html <meta name="msapplication-tap-highlight" content="no"> ``` 在Webkit浏览器中...

    项目实战小总结

    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } ``` - **作用**: 去除触摸时的蓝色边框或半透明灰色遮罩。 ### 三、动画效果优化 1. **使用CSS3动画**: - **优势**: 使用`transition`、`transform`或`...

    移动端经验速递手册下载

    - **方法**: 通过设置CSS属性`-webkit-tap-highlight-color: transparent;`来取消触摸时的高亮效果。 **2.3 禁止选中内容** - **方法**: 使用`-webkit-user-select: none;`属性阻止用户选中页面内容。 **2.4 快速...

    H5中取消a标签在点击时的背景颜色的方法

    -webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-user-select: none; -moz-user-focus: none; -moz-user-select: none; } 2、使用图片作为a标签的点击按钮时,当触发touchstart的时候,往往会有...

    CSS3解决移动页面上点击链接触发色块的问题

    `-webkit-tap-highlight-color`是一个专属于WebKit渲染引擎(如Safari和Chrome)的属性,它允许开发者自定义用户点击元素时显示的高亮颜色。虽然这不是一个官方的W3C CSS规范,但在移动设备上广泛使用,尤其是iOS和...

    浅淡移动web开发.ppt

    对于移动Web开发中的样式问题,可以使用`-webkit-tap-highlight-color`消除点击元素时的阴影,`-webkit-appearance:none`消除输入框的内阴影并定制样式,`-webkit-transform:translate3d(0, 0, 0)`启用硬件加速以...

    UIWebView的使用代码

    有用的控件,经常使用设置背景透明 设置webview的backgroundColor属性为[UIColor clearColor]; ? 1 webView.backgroundColor = [UIColor clearColor];... -webkit-tap-highlight-color:rgba(0,0,0,0);

    移动端开发HTML5页面点击按钮后出现闪烁或黑色背景的解决办法

    -webkit-tap-highlight-color:transparent; *{ -webkit-tap-highlight-color:transparent; } GitHub:Fuck me on GitHub Fuck me on GitHub 总结 以上所述是小编给大家介绍的移动端开发HTML5页面点击按钮后出现...

    移动端兼容问题

    - 部分Android设备会在元素被点击时显示边框,可以通过设置`-webkit-tap-highlight-color`为`transparent`或者修改元素的border来消除此效果。 处理好这些问题有助于提升移动端Web应用的用户体验和性能。开发者...

Global site tag (gtag.js) - Google Analytics