在移动端网站,当你点击加了a标签的文字或图片时,该元素的周围会闪现一个蓝色的边框,在微信上的网站就是如此;而有的浏览器会闪现一个半透明遮罩层,比如移动端的Chrome浏览器,其实这些特效无非就是为了告诉用户已点击了该元素,提升用户体验,但有的时候你会觉得这些特效看起来很别扭,就想着清除它,其实这很简单,只要加上一句CSS就行了。

  清除所有a标签在点击时出现的特效:

  a{ -webkit-tap-highlight-color:rgba(255,0,0,0);}

  如果我们希望用户不能复制文字,可以使用下面的属性:

    -webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;

  这样,设置了该属性的标签中的内容就不可以选择文字了。

移动端优化 && 清除移动端网站点击a标签时闪现的边框或遮罩层(CSS) && 移动端点击 && 文字不可选择的更多相关文章

  1. PC端和移动APP端CSS样式初始化

    CSS样式初始化分为PC端和移动APP端 1.PC端:使用Normalize.css Normalize.css是一种CSS reset的替代方案. 我们创造normalize.css有下面这几个目的 ...

  2. 全面解密QQ红包技术方案:架构、技术实现、移动端优化、创新玩法等

    本文来自腾讯QQ技术团队工程师许灵锋.周海发的技术分享. 一.引言 自 2015 年春节以来,QQ 春节红包经历了企业红包(2015 年).刷一刷红包(2016 年)和 AR 红包(2017 年)几个 ...

  3. 【译】Optimize for mobile-移动端优化

    移动端优化 由于移动设备有限的CPU处理能力,移动网络的高往返时间,以及移动应用的快速增长,对移动端的理解以及优化相对于PC端来讲变得更加重要.Page Speed Insights 现在可以让你轻松 ...

  4. JS判断移动端还是PC端(改造自腾讯网) 仅用于宣传动画,下载页等

    JS判断移动端还是PC端(改造自腾讯网 http://www.qq.com/) 本脚本仅用于宣传动画,下载页( ipad 也算pc端)等,  ionic 用 ionic.platform 即可( io ...

  5. Web端测试和移动端测试的区别

    1.记录bug 在Web端可以通过系统自带的截图和QQ截图等方式来截取bug的图片,对于错误的地方可以用工具自带的标识来重点标记. 对于移动端设备可以用手机自带的截图工具来截图然后传到电脑上,个人一般 ...

  6. web端测试和移动端测试的区别小记

    转:http://qa.blog.163.com/blog/static/19014700220157128345318/ 之前一直参与web端的测试,最近一个项目加入了移动端,本人有幸参与了移动端的 ...

  7. 在OneThink(ThinkPHP3.2.3)中整合阿里云OSS的PHP-SDK2.0.4,实现Web端直传,服务端签名直传并设置上传回调的实现流程

    在OneThink(ThinkPHP3.2.3)中整合阿里云OSS的PHP-SDK2.0.4,实现本地文件上传流程 by shuijingwan · 2016/01/13 1.SDK安装 github ...

  8. 移动端开发demo—移动端web相册(一)

    本文主要是介绍开发移动端web相册这样一案例用到的前置知识. 一.移动端样式 移动端更接近手机原生的方式. 如下是一个angular mobile的demo的例子: 移动端demo做成这样的好处: 在 ...

  9. js如何判断用户是在pc端和还是移动端访问

    js如何判断用户是在pc端和还是移动端访问 来源:A5技术交流 作者:wofa 时间:2014-04-25收藏本页 最近一直在忙我们团队的项目“咖啡之翼”,在这个项目中,我们为移动平台提供了一个优秀的 ...

随机推荐

  1. Linux文件备份

    1.tar -P是否保留根目录 -t查看压缩文件内容 -N 201401010备份日期以后 [root@localhost /]# tar -zcPf /tar/data2.tar.gz /etc/* ...

  2. ldap域账号登录

    $host = "iflytek.com"; $user = 'yimiao@'.$host;//'用户名@域名'; $pswd = "******"; //1 ...

  3. js 中的 2 与 "2"

    case1: "15" * 2 结果:30 case2: 2 * "15" 结果:30 case3: "2" * "15" ...

  4. linux每天一小步---cp命令详解

    1 命令功能      cp命令用于复制文件或者目录,cp是copy的缩写. 2 命令语法 cp  [参数] 源文件或者目录  目的文件或者目录 3 命令参数 -a  等同于-dRp,保存所有 -d ...

  5. 23 DesignPatterns学习笔记:C++语言实现 --- 1.3 Singletion

    23 DesignPatterns学习笔记:C++语言实现 --- 1.3 Singletion 2016-07-21 (www.cnblogs.com/icmzn) 模式理解  

  6. 怎样运用servlet

    制作登陆界面 login.html <!DOCTYPE html> <html> <head> <title>login.html</title& ...

  7. 自我简介与Github的注册和使用

    我叫陈鑫,学号1413042059,来自网络工程142班.喜欢打乒乓球,玩策略类游戏,团队竞技.                                                     ...

  8. (转)JDBC模板类。

    Spring JDBC抽象框架core包提供了JDBC模板类,其中JdbcTemplate是core包的核心类,所以其他模板类都是基于它封装完成的,JDBC模板类是第一种工作模式. JdbcTempl ...

  9. BFC开启条件

    当元素CSS属性设置了下列之一时,即可创建一个BFC: float:left|right position:absolute|fixed display: table-cell|table-capti ...

  10. WebApi 插件式构建方案:IOC 容器初始化

    body { border: 1px solid #ddd; outline: 1300px solid #fff; margin: 16px auto; } body .markdown-body ...