Maison >interface Web >tutoriel HTML ><meta>标签_html/css_WEB-ITnose

<meta>标签_html/css_WEB-ITnose

WBOY
WBOYoriginal
2016-06-24 11:18:48925parcourir

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内容。


      用法:

    Déclaration:
    Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn