meta标签大全

香菊网 发表于: 2019-06-03 分类: css  H5部分  前端front  

每次都会用到一些meta标签,这里做一下整理 声明文档使用的字符编码 ;

<meta charset="utf-8">

移动端开发Viewport

content参数说明
width=viewport 宽度(数值/device-width)
height=viewport 高度(数值/device-height)
initial-scale 初始缩放比例
maximum-scale 最大缩放比例
minimum-scale 最小缩放比例
user-scalable 是否允许用户缩放(yes/no)
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

设置IE浏览器渲染页面的兼容模式

content参数说明
ie=edge 以IE可用最高版本渲染页面
chrome=1 Google Chrome Frame(谷歌内嵌浏览器框架GCF),插件可以让用户的IE浏览器外不变,但用户在浏览网页时,实际上使用的是Chrome浏览器内核

<meta http-equiv="X-UA-Compatible" content="ie=edge, chrome=1">

SEO优化

<!-- 定义页面的关键词,一般不超过100字符 -->
<meta name="keywords" content="轩陌,轩陌博客">

<!-- 定义页面的描述,一般不超过200字符 -->
<meta name="description" content="描述不超过200字符">

禁止数字识自动别为电话号码 and 禁止识别邮箱

<!-- 禁止数字识自动别为电话号码 -->
<meta name="format-detection" content="telephone=no">
<!-- 禁止识别邮箱 -->
<meta name="format-detection" content="email=no">

国产浏览器指定模式渲染

<!-- 360写法 -->
<meta name="renderer" content="webkit"> 
<!-- 其他浏览器写法 -->
<meta name="force-rendering" content="webkit"> 

QQ浏览器

<!-- 在指定方向上锁定屏幕(锁定横/竖屏) -->
<meta name="x5-orientation" content="landscape/portrait">
<!-- 全屏显示此页面 -->
<meta name="x5-fullscreen" content="true">
<!-- 页面将以“应用模式”显示(全屏等)-->
<meta name="x5-page-mode" content="app">

UC浏览器

<!-- 在指定方向上锁定屏幕(锁定横/竖屏) -->
<meta name="screen-orientation" content="landscape/portrait">
<!-- 全屏显示此页面 -->
<meta name="full-screen" content="yes">
<!-- 禁止进入夜间模式 -->
<meta name="nightmode" content="disable">
<!-- 无图模式强制加载图片 -->
<meta name="imagemode" content="force">
标签: cssH5部分前端front
Copyright © 2019 幻雨焉缘博客 | 浙ICP备19001843号-1
----------------------------------
种一棵树,最好的培养时间是十年前,其次是现在 加油  (ง •_•)ง。        ──── 前端攻城狮