web页面一些移动端样式属性设置

1.有些页面在iPhone手机下的浏览器会出现点击有一个蒙版出现，可以通过以下css样式消除

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

2.移动端响应式页面要加上如下的表头

<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

3.iPhone的Safari浏览器会识别一些电话号码加上了一些不好看的样式，可以通过以下meta标签消除

<meta name="format-detection" content="telephone=no" />

4.消除a链接的一些点击，访问等出现的一些样式

a { text-decoration: none; }
a:hover { text-decoration: none; }
a:hover,a:active,a:visited,a:link,a:focus{
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
    outline:none;
    background: none;
    text-decoration: none;
    color:#000000;
}

5.页面自适应屏幕使用rem设计网页的宽度

<script>
 /* 长宽占位 rem算法, 根据root的rem来计算各元素相对rem, 默认html 320/20 = 16px */
 function placeholderPic(){
  var w = document.documentElement.offsetWidth;
  document.documentElement.style.fontSize=w/20+'px';
 }
 placeholderPic();
 window.onresize=function(){
  placeholderPic();
 }
script>

未完后续工作中涉及到再陆续添加