Home >Web Front-end >HTML Tutorial ><meta>标签_html/css_WEB-ITnose

<meta>标签_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:18:48921browse

1.viewport

能优化移动浏览器的显示。如果不是响应式网站,不要使用initial-scale或者禁用缩放。
大部分4.7-5寸设备的viewport宽设为360px;5.5寸设备设为400px;iphone6设为375px;ipone6 plus设为414px。

       //表示支持响应式设计

width:控制 viewport 的大小,可以指定的一个值,如果 600,或者特殊的值,如 device-width 为设备的宽度(单位为缩放为 100% 时的 CSS 的像素)。
height:和 width 相对应,指定高度。
initial-scale:初始缩放比例,也即是当页面第一次 load 的时候缩放比例。
maximum-scale:允许用户缩放到的最大比例。
minimum-scale:允许用户缩放到的最小比例。
user-scalable:用户是否可以手动缩放(user-scalable=no//user-scalable=0,不允许用户手动缩放)

注意:content里多个属性的设置一定要用逗号+空格来隔开,如果不规范将不会起作用

WebApp全屏模式:伪装app,离线应用

  //启用 WebApp 全屏模式

隐藏状态栏/设置状态栏颜色:只有在开启WebApp全屏模式时才生效。content的值为default | black | black-translucent 

添加到主屏后的标题

忽略数字自动识别为电话号码

忽略识别邮箱

添加智能 App 广告条 Smart App Banner:告诉浏览器这个网站对应的app,并在页面上显示下载banner

 

网页相关

  • 申明编码
  • <meta charset='utf-8' />
  • 优先使用 IE 最新版本和 Chrome
  • <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /><!-- 关于X-UA-Compatible --><meta http-equiv="X-UA-Compatible" content="IE=6" ><!-- 使用IE6 --><meta http-equiv="X-UA-Compatible" content="IE=7" ><!-- 使用IE7 --><meta http-equiv="X-UA-Compatible" content="IE=8" ><!-- 使用IE8 -->
  • 浏览器内核控制:国内浏览器很多都是双内核(webkit和Trident),webkit内核高速浏览,IE内核兼容网页和旧版网站。而添加meta标签的网站可以控制浏览器选择何种内核渲染。
  •  <meta name="renderer" content="webkit|ie-comp|ie-stand">

    国内双核浏览器默认内核模式如下:
    1. 搜狗高速浏览器、QQ浏览器:IE内核(兼容模式)
    2. 360极速浏览器、遨游浏览器:Webkit内核(极速模式)

  • 禁止浏览器从本地计算机的缓存中访问页面内容:这样设定,访问者将无法脱机浏览。
  • <meta http-equiv="Pragma" content="no-cache">
  • Windows 8
  • <meta name="msapplication-TileColor" content="#000"/> <!-- Windows 8 磁贴颜色 --><meta name="msapplication-TileImage" content="icon.png"/> <!-- Windows 8 磁贴图标 -->
  • 站点适配:主要用于PC-手机页的对应关系。
  • <meta name="mobile-agent"content="format=[wml|xhtml|html5]; url=url"><!--[wml|xhtml|html5]根据手机页的协议语言,选择其中一种;url="url" 后者代表当前PC页所对应的手机页URL,两者必须是一一对应关系。 -->
  • 转码申明:用百度打开网页可能会对其进行转码(比如贴广告),避免转码可添加如下meta
  • <meta http-equiv="Cache-Control" content="no-siteapp" /><br />

    2.Content-Type和Content-Language (显示字符集的设定)


      说明:设定页面使用的字符集,用以说明主页制作所使用的文字已经语言,浏览器会根据此来调用相应的字符集显示page内容。


      用法:

    Statement:
    The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn