移动端手机web前端meta通用设置

手机版页面通常需要设置mate标签，来实现禁止缩放等效果。

<!--页面字符编码--><meta charset="utf-8">

<!--避免IE使用兼容模式--><meta http-equiv="X-UA-Compatible"content="IE=edge,chrome=1">

<!-- 启用360浏览器的极速模式(webkit)--><meta name="renderer"content="webkit">

<!--微软的老式浏览器--><meta name="MobileOptimized"content="320">

<!--关键字描述--><meta name="keywords"content=""><meta name="description"content="">

<!--设置移动端视图--><meta name="viewport"content="width=device-width, initial-scale=1, user-scalable=no"/>

<!--针对手持设备优化，主要是针对一些老的不识别viewport的浏览器，比如黑莓--><meta name="HandheldFriendly"content="true">

<!--删除苹果默认的工具栏和菜单栏--><meta name="apple-mobile-web-app-capable"content="yes"/>

<!--设置苹果工具栏颜色--><meta name="apple-mobile-web-app-status-bar-style"content="black"/>

<!--忽略页面中的数字识别为电话，忽略email识别--><meta name="format-detection"content="telphone=no, email=no"/>

<!--uc强制竖屏--><meta name="screen-orientation"content="portrait">

<!--QQ强制竖屏--><meta name="x5-orientation"content="portrait">

<!--UC强制全屏--><meta name="full-screen"content="yes">

<!--QQ强制全屏--><meta name="x5-fullscreen"content="true">

<!--UC应用模式--><meta name="browsermode"content="application">

<!--QQ应用模式--><meta name="x5-page-mode"content="app">

<!--windows phone 点击无高光--><meta name="msapplication-tap-highlight"content="no">

meta标签用来定义html的语言类型

http-equiv="Content-Type"相当于http的文件头作用,说明文本类型

content="text/html

内容是html语言

charset=gb2312"设置该页面的编码格式比如还有utf-8

,GBK,ISO-8859-1

响应式布局详解之head标签添加的属性详解

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

表示:设置屏幕按1：1的尺寸显示，在 iPhone 和其他智能手机的浏览器提供网站全视图浏览，并禁止用户缩放页面。

<meta http-equiv="X-UA-COMPATIBLE" CONTENT="IE=edge,chrome=1">

表示：如果安装了GCF，则使用GCF(Chrome内核 :Google Chrome Frame)来渲染页面「"chrome=1"」，如果没有安装GCF，则使用最高版本的IE内核进行渲染「"IE=edge"」。 http-equiv="X-UA-Compatible"这个是IE8的专用标记，是用来指定Internet Explorer 8 浏览器模拟某个特定版本IE浏览器的渲染方式，以此来解决IE浏览器的兼容问题。

---