特有标签

1.设置浏览器兼容版本

    <meta http-equiv="X-UA-Compatible" content="IE=8">             表示IE浏览器默认版本为8

    <meta http-equiv="X-UA-Compatible" content="IE=edge">       表示IE浏览器默认选择最高版本

2. 手机端特有的标签

  (1).视口

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

 视口的作用:在移动浏览器中,当页面宽度超出设备,浏览器内部虚拟的一个页面容器,将页面容器缩放到设备这么大,然后展示。

   目前大多数手机浏览器的视口(承载页面的容器)宽度都是980;

   视口的宽度可以通过meta标签设置

   此属性为移动端页面视口设置,当前值表示在移动端页面的宽度为设备的宽度,并且不缩放(缩放级别为1)

  + width:视口的宽度

  + initial-scale:初始化缩放

  + user-scalable:是否允许用户自行缩放(值:yes/no; 1/0)

  + minimum-scale:最小缩放,一般设置了用户不允许缩放,就没必要设置最小和最大缩放

  + maximum-scale:最大缩放

  (2).是否允许全屏

<meta content="yes" name="apple-mobile-web-app-capable">

该meta标签是iphone设备中的safari私有meta标签,它表示:允许全屏模式浏览;

  (3).顶部状态条的颜色

<meta content="black" name="apple-mobile-web-app-status-bar-style" 

该meta标签也是iphone的私有标签,它指定的iphone中safari顶端的状态条的样式;

在web app应用下状态条(屏幕顶部条)的颜色;默认值为default(白色),可以定为black(黑色)和black-translucent(灰色半透明)。注意:若值为“black-translucent”将会占据页面px位置,浮在页面上方(会覆盖页面20px高度–iphone4和itouch4的Retina屏幕为40px)。

  (4).忽略数字识别为电话号码

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

  该meta标签表示:告诉设备忽略将页面中的数字识别为电话号码。

 

 

 

posted @ 2016-09-25 22:21  Yaopengfei  阅读(287)  评论(0编辑  收藏  举报