移除手机端a标签点击自动出现的边框和背景
手机端a标签会自动补充出现边框或者背景,使得用户知道a标签的点击状态,但样式很不好看
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>我的生活</title>
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
<link rel="shortcut icon" href="/favicon.ico">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<style>
a{
border:none;
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-tap-highlight-color:transparent;
outline:none;
}
</style>
</head>
<body>
<a href="https://www.baidu.com/">测试边框</a>
</body>
</html>
其中对a添加样式
a{
border:none;
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-tap-highlight-color:transparent;
outline:none;
}
-webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-tap-highlight-color:transparent; 都可以将该阴影透明化,进而解决那个丑丑的边框问题
移除手机端a标签点击自动出现的边框和背景的更多相关文章
- 【极品代码】一般人我不告诉他,手机端h5播放时不自动全屏代码
已测适用于ios,某些安卓手机微信下播放视频会出现播放器控件(这个实在是无力吐槽噢,因为之前还遇到过微信播放完视频后竟然无法退出全屏出现广告的情况,只有播放完后刷新页面并且要放到框架页里才能屏蔽微信视 ...
- Trick:如何去掉html标签点击时的蓝色边框
我们在用html标签时,如input.button.select,img标签时,点击标签经常出现一个蓝色的边框,这个边框真的很low,想要去掉怎么办 其实,css有样式可以设置一下,这个问题就轻松 ...
- 去除手机端a标签等按下去背景色
a,button,input,textarea,label,i,em{/*highlight*/ -webkit-tap-highlight-color: rgba(255,0,0,0); borde ...
- a标签点击触发 layer open 只显示背景解决
问题:公司网站突然说有个查看信息的点击不好使了,有时候点击无反应,但是href执行了,有时候弹出只有背景,不显示内容.网上找了a标签的各种方法尝试后,均不能解决. 代码:类似如下,method()方法 ...
- 手机端页面访问PC页面自动跳手机端代码
<script> var mobileAgent = new Array("iphone", "ipod", "ipad", & ...
- js判断手机端操作系统(Andorid/IOS)
非常实用的js判断手机端操作系统(Andorid/IOS),并自动跳转相应下载界面 androidURL = "http://xxx/xxx.apk"; var browser = ...
- js判断手机端操作系统的两种方法
//判断手机端操作系统(Andorid/IOS),并自动跳转相应下载界面 androidURL ="http://xxx/xxx.apk"; var browser = { ver ...
- 原生js实现响应式轮播图,支持电脑端点击切图,手机端滑动切图
轮播图的实现原理并不难,但是步骤有些繁琐.最近练习了一个轮播图,大部分是跟着网上的教程写的,然后自己做了一点兼容ie8的修改,加了点击切换图片的特效和手机端的滑动特效,让这个轮播图可以在响应式的网站中 ...
- 手机端flex、字体设置、快速点击
;(function flexible (window, document) { var docEl = document.documentElement ♥1 var dpr = window.de ...
随机推荐
- Spring Boot2(007):关于Spring beans、依赖注入 和 @SpringBootApplication 注解
一.关于Spring beans 和 依赖注入(Dependency Injection) spring boot 和 Spring 全家桶无缝衔接,开发过程中可以很轻松地使用 Spring 全家桶的 ...
- 【Cantor表】蒟蒻题解
原题:传送门 (上图摘自网站OpenJudge - NOI题库2.1 Cantor表) 本蒟蒻的题解,让大神们见笑了! 首先,进行找规律. 大家可以发现: 1.当分子是一的时候,且分子和分母的和是偶数 ...
- 033-PHP取1-100的随机数
<?php // 生成一个随机数 // 从1到100中取得随机数 for ($index = 0; $index < 100; $index++) { $number = (rand() ...
- java 实体 set数据 报空指针异常
今天在做一个调用阿里云AXB隐私保护,需要调用通话记录的消费队列,然后set到实体中,然后插入到数据库,但是set的这一步报错 以为工具拿不到值,然后打印发现是有值的, 然后再看一下实例的类型是没错的 ...
- ES6中字符串的新增方法梳理
1.String.fromCodePoint(); String,fromCodePoint()方法可以认为是对String.fromCharCode()方法的扩展,这两个方法的共同点在于都是用于Un ...
- 心形java和C语言2019/10/17
在网上无意中看到这个代码,学习了一下心形函数的知识:http://mathworld.wolfram.com/HeartCurve.html package dada; /** * 了解Heart C ...
- 14 ~ express ~ 显示用户数据
一,router/admin.js var express = require('express') var router = express.Router() var User = require( ...
- 将java项目转成svn项目
1.需要工具:eclipse / svn插件 2.在需要共享的项目上右键-->team-->Share Project分享项目 3.选择svn 如果需要共享成cvs选择cvs即可. 4.选 ...
- css代码实现列表等宽
实现上面的手机页面,我们会遇到一个自适应的问题,但是手机页面的屏幕大小不一致,自适应的问题不是百分比可以好好解决的,我采用下面的布局:display:flex; <!DOCTYPE html&g ...
- 理解python中的'*','*args','**','**kwargs'
本文来源:http://blog.csdn.net/callinglove/article/details/45483097 让我们通过以下6步来理解: 1. 通过一个函数调用来理解’*’的作用 2. ...