整理一下手机端样式填过的坑

1、手机端去除a链接点击时候的背景框

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

2、手机端去除a标签长按显示在浏览器中打开的效果

苹果手机：-webkit-touch-callout: none;touch-callout: none;

安卓手机：安卓手机的不能用样式控制，需要用到js（或者将标签换成其他标签添加点击跳转事件）

$(‘a‘).ontouchstart = function(e) { function(e) { e.preventDefault(); };

3、手机端去除点击的时候添加的选中样式

.name { -webkit-touch-callout: none;-webkit-touch-callout: none; -webkit-user-select: none;-webkit-user-select: none; -khtml-user-select: none;-khtml-user-select: none; -moz-user-select: none;-moz-user-select: none; -ms-user-select: none;-ms-user-select: none; user-select: none;user-select: none; }

4、iphone上去掉输入框的内阴影

#div{ .... appearance:button; -moz-appearance:button; /* Firefox */-moz-appearance:button; /* Firefox */ -webkit-appearance:button; /* Safari 和 Chrome */-webkit-appearance:button; /* Safari 和 Chrome */ }

设置不加载缓存方法集锦：

 

1、在meta标签中添加以下代码（手机端测试暂时无效，pc端没有测试）

<meta http-equiv="expires" content="0">meta http-equiv="expires" content="0"> <meta http-equiv="pragma" content="no-cache">meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache">meta http-equiv="cache-control" content="no-cache">   另外一段代码 <meta http-equiv=Cache-Control content=no-cache /> meta http-equiv=Cache-Control content=no-cache /> 必须结合其他： <!-- 禁止浏览器从本地缓存中调阅页面。--> <meta http-equiv="pragram" content="no-cache"> meta http-equiv="pragram" content="no-cache"> <!--网页不保存在缓存中，每次访问都刷新页面。--> <meta http-equiv="cache-control" content="no-cache, must-revalidate"> meta http-equiv="cache-control" content="no-cache, must-revalidate"> <!--同上面意思差不多，必须重新加载页面--> <meta http-equiv="expires" content="0"> meta http-equiv="expires" content="0"> <!--网页在缓存中的过期时间为0，一旦网页过期，必须从服务器上重新订阅--> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 

2、在引用的时候添加版本号

<script type="text/javascript" src="/js/testjs.js"></script>script type="text/javascript" src="/js/testjs.js"></script> // 修改为 <script type="text/javascript" src="/js/testjs.js?randomId=<%=Math.random()%>"></script>script type="text/javascript" src="/js/testjs.js?randomId=<%=Math.random()%>"></script>

3、给文件加时间戳

添加前：<script src="js/test.js"></script>

添加后： <script src="js/test.js?_=1480405186452"></script>

这样只能解决html引入的js或css的缓存问题，html的缓存还是没有解决，也就是说你手机扫码进入页面后，看到的是之前缓存好的【加时间戳前】的html文件，就导致了加的时间戳不生效

4、html的缓存也可以添加时间戳来解决

添加前：http://v35new.faqrobot.org/robot/app.html

添加后：http://v35new.faqrobot.org/robot/app.html?_=1480405186452