手机浏览器去除点击出现的背景色

在移动端站点,击某个链接、按钮或者图片的时候,系统会默认加上一些灰色的背景和一些高亮的效果。

但是挑剔的客户决不允许这么丑的东西出现,要去除或者改变。

所以就用到了css的tap-highlight-color样式属性了。

这么设置:-webkit-tap-highlight-color: transparent;

问题是解决了,但是下次遇到类似的位置问题怎么处理,搜索都不知道怎么描述。

我的经验就是参考相同类型的成熟站点。

比如我遇到这个问题的时候是在做一个电子商务网站,那么打开淘宝京东苏宁等的手机站点,审查元素,分分钟的出结果。

授初学者以渔。

时间: 2024-08-10 21:30:26

手机浏览器去除点击出现的背景色的相关文章

CSS3去除手机浏览器按钮点击出现的高亮框

在工作中经常遇到在手机浏览器中浏览网页时,点击页面中的按钮或者是具备点击事件的元素,就会出现一个默认的高亮框,影响整体的感官体验. 可以用一个简单的css3属性来解决:tap-highlight-color,最好加上webkit浏览器前缀. -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent; /* For some Androids,个人感觉是低版本的安卓,4.0以下 */ 如

【微信ticket跳转】手机浏览器网页跳转到微信内置浏览器打开

[微信ticket跳转]手机浏览器网页跳转到微信内置浏览器打开 起始不少人已经关注到了招行的智能客服:http://xyk.cmbchina.com/Latte/wx/20150520wkf?from=ISTA004&clientid= 招行的这个跳转,发现后台返回的这个数据{"returnCode":"0000","returnMessage":"success","url":"weix

android 点击桌面图标,打开手机浏览器进入相应的网站

做一个假的adnroid app,要实现点击桌面图标,打开手机浏览器进入相应的网站,实现方法很简单 import android.app.Activity; import android.content.Intent; import android.net.Uri; import android.os.Bundle; public class MainActivity extends Activity { @Override protected void onCreate(Bundle save

CSS 兼容手机浏览器 点击蓝色边框

* { -webkit-tap-highlight-color: transparent; -webkit-appearance: none; } CSS放入全局,屏蔽部分手机浏览器 点击链接出现蓝色虚线框.

手机微信内点击网页链接或识别二维码直接调用手机浏览器打开的解决方案

常使用微信分享网页链接的朋友可能都会经常碰到打开后提示 “已停止访问该网页” 的情况,遇到这种情况的时候,很多人不知道怎么办,其实做到微信内打开网页自动唤醒手机默认浏览器打开就能解决问题了.下面给大家讲解一下这个功能实现过程. 功能目的 生成微信跳转链接,实现微信内置浏览器跳转外部浏览器打开网页. 操作步骤 第一步:打开 ElephantJump 第二步:填入网页链接点击生成 第三步:复制跳转链接和二维码 第四步:分享跳转链接和二维码 实现效果 功能实现后, 苹果用户即可在微信内直接下载app也

在PC上测试移动端网站和模拟手机浏览器的5大方

查了很多资料,尝试了大部分方法,下面将这一天的努力总结下分享给大家,也让大家免去看那么多文章,以下介绍的方法,都是本人亲自测试成功的方法,测试环境winxp. 一.Chrome*浏览器 chrome模拟手机总共有四种方法,原理都一样,通过伪装User-Agent,将浏览器模拟成Android设备.以下标星的为推荐方法. 1.新建Chrome快捷方式 右击桌面上的Chrome浏览器图标,在弹出的右键菜单中选择"复制",复制一个图标副本到桌面.右击该副本,选择"属性",

手机浏览器调试建议

使用电脑远程调试安卓手机上浏览器的JS (2014-01-14 22:44:04) 转载▼     有时候要开发在手机浏览器上运行的网页,这样就涉及到要调试JS,在电脑上怎么模拟,跟使用真机还是有区别,这里介绍几种用电脑远程调试JS的方法. 1.使用google浏览器,因为安卓本来就是谷歌的,因此它本身对此有支持,开发了相关的插件 1)首先,电脑上要有谷歌浏览器(Chrome),最好是最新版的(Chrome 31以上): 2)安装了安卓的SDK: 3)手机上也安装谷歌浏览器(Chrome for

在PC上测试移动端网站和模拟手机浏览器的5大方法

查了很多资料,尝试了大部分方法,下面将这一天的努力总结下分享给大家,也让大家免去看那么多文章,以下介绍的方法,都是本人亲自测试成功的方法,测试环境winxp. 一.Chrome*浏览器 chrome模拟手机总共有四种方法,原理都一样,通过伪装User-Agent,将浏览器模拟成Android设备.以下标星的为推荐方法. 1.新建Chrome快捷方式 右击桌面上的Chrome浏览器图标,在弹出的右键菜单中选择"复制",复制一个图标副本到桌面.右击该副本,选择"属性",

微信jsApI及微信分享对应在手机浏览器的调用总结。

摘录自别人的博客: 第一篇:微信内置浏览器的JsAPI(WeixinJSBridge续) 之前有写过几篇关于微信内置浏览器(WebView)中特有的Javascript API(Javascript Interface)的文章,不过随着微信官方的调整,部分API已经不能直接使用,比如类似直接分享到朋友圈 WeixinJSBridge.invoke('shareTimeline',data,callback) 这样的功能,直接调用,会得到一个访问拒绝的response.后来重新调研了下,整理出来了