http-equiv

告诉浏览器当前访问的资源类型并声明编码

<meta http-equiv="Content-Type" content="text/html; charset="utf-8" />

refresh（重定向,5秒后会跳转到：http://baidu.com）

<meta http-equiv="refresh" content="5;url="http://baidu.com" />

Set-Cookie（网页过期则cookie将会被删除，必须是GMT的时间格式）

<meta http-equiv="Set-Cookie" content="cookievalue=xxx;expires=Wednesday,21-Oct-98 16:14:21 GMT;path=/">

Window-target（强制页面在当前窗口以独立页面显示，用来防止别人在框架里面调用你的页面）

<meta http-equiv="Window-target" content="_top">

expires(期限，一旦网页过期，必须到服务器上重新调阅，必须使用GMT的时间格式)

<meta http-equiv="expires" content="Wed, 26 Feb 2016 08:21:57GMT">

Pragma(cache模式，禁止浏览器从本地机的缓存中调阅页面内容，访问者无法脱机浏览)

<meta http-equiv="Pragma" content="no-cache">

设置视窗大小（自适应）

<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1">(H5常用设置)
<meta name="HandheldFriendly" content="true">部分老浏览器不支持 viewport，使用如下 meta 对其进行设备优化

width 设置layout viewport 的宽度，为一个正整数，或字符串"width-device"
height 设置layout viewport 的高度，这个属性对我们并不重要，很少使用
initial-scale 设置页面的初始缩放值，为一个数字，可以带小数
minimum-scale 允许用户的最小缩放值，为一个数字，可以带小数
maximum-scale 允许用户的最大缩放值，为一个数字，可以带小数
shrink-to-fit=no IOS9中要想前面的属性起作用需要加上这个
user-scalable 是否允许用户进行缩放，值为"no"或"yes", no 代表不允许，yes代表允许

搜索引擎抓取

<meta name="robots" content="index,follow"/>

all：文件将被检索，且页面上的链接可以被查询；
none：文件将不被检索，且页面上的链接不可以被查询；
index：文件将被检索；
follow：页面上的链接可以被查询；
noindex：文件将不被检索；
nofollow：页面上的链接不可以被查询。

禁止百度转码

<meta http-equiv="Cache-Control" content="no-siteapp"/>
<meta http-equiv="Cache-Control" content="no-transform"/>

页面关键词

<meta name="keywords" content=""/>

页面描述

<meta name="description" content="不超过150个字符"/>

网页作者

<meta name="author" content="name, email@gmail.com"/>

网站设置，

取消默认，数字识别为电话，取消email识别，地图链接adress识别

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

禁止链接高亮

<meta name="msapplication-tap-highlight" content="no">

网站添加到主屏后的标题web-app设置

<meta name="apple-mobile-web-app-title" content="标题" />

工具栏设置

<meta name="apple-mobile-web-app-capable" content="yes" />  webapp全屏模式
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" /> 
在apple-mobile-web-app-capable 为 yes 的前提下进行设置

UC浏览器无图模式，强制图片显示

<meta name="imagemode" content="force"/> // 对该页面全部图片设置
<img src="" show="force"> // 对单个图片的设置

Meta property=og协议

<meta property="{Meta property=og协议属性}" content="{内容}" />

Meta Property=og主要标签属性

og:title 标题
og:type 标签是每一段内容的起始处class属性（常用值:article book movie）
og:image 略缩图地址
og:author 作者名称
og:url 页面地址
og:release_date 发布时间
og:description 页面的简单描述
og:site_name 页面所在网站名
og:videosrc 视频或者Flash地址
og:audiosrc 音频地址

网站内核

强制Chromium内核，作用于360浏览器、QQ浏览器等国产双核浏览器

<meta name="renderer" content="webkit"/>

强制Chromium内核，作用于其他双核浏览器

<meta name="force-rendering" content="webkit"/>

如果有安装 Google Chrome Frame 插件则强制为Chromium内核，否则强制本机支持的最高版本IE内核，作用于IE浏览器

<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/>

强制Chromium内核，作用于其他双核浏览器

<meta name="force-rendering" content="webkit"/>

清除页面缓存

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">

强制Webkit内核和提示低版本IE访问用户升级

<meta name="renderer" content="webkit"/>
<meta name="force-rendering" content="webkit"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>

PC端常用

使用 IE 标准模式渲染
<meta http-equiv="X-UA-Compatible" content="IE=edge">
强制 IE 使用 Chrome Frame 渲染
<meta http-equiv="X-UA-Compatible" content="chrome=1">
360 浏览器
<meta name="renderer" content="webkit"> // 默认webkit内核
<meta name="renderer" content="ie-comp"> // 默认IE兼容模式
<meta name="renderer" content="ie-stand"> // 默认IE标准模式

移动端常用

<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1.0, minimum-scale=1.0,user-scalable=no" />
<meta name="format-detection" content="telephone=no">
<meta name="format-detection" content="email=no">
<meta name="format-detection" content="adress=no">
<meta name="screen-orientation" content="portrait">
<meta name="x5-fullscreen" content="true" />

移动端模板

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, shrink-to-fit=no" >
<meta name="format-detection" content="telephone=no" >
<title>移动端HTML模版</title>
    
<!-- S DNS预解析 -->
<link rel="dns-prefetch" href="">
<!-- E DNS预解析 --> 

<!-- S 线上样式页面片，开发请直接取消注释引用 -->
<!-- #include virtual="" -->
<!-- E 线上样式页面片 -->

<!-- S 本地调试，根据开发模式选择调试方式，请开发删除 --> 
<link rel="stylesheet" href="css/index.css" >
<!-- /本地调试方式 -->

<link rel="stylesheet" href="http://srcPath/index.css" >
<!-- /开发机调试方式 -->
<!-- E 本地调试 -->

</head>
<body>

</body>
</html>

pc端模板

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="keywords" content="your keywords">
<meta name="description" content="your description">
<meta name="author" content="author,email address">
<meta name="robots" content="index,follow">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<meta name="renderer" content="ie-stand">
<title>PC端HTML模版</title>

<!-- S DNS预解析 --> 
<link rel="dns-prefetch" href="">
<!-- E DNS预解析 --> 

<!-- S 线上样式页面片，开发请直接取消注释引用 -->
<!-- #include virtual="" -->
<!-- E 线上样式页面片 -->

<!-- S 本地调试，根据开发模式选择调试方式，请开发删除 --> 
<link rel="stylesheet" href="css/index.css" >
<!-- /本地调试方式 -->

<link rel="stylesheet" href="http://srcPath/index.css" >
<!-- /开发机调试方式 -->
<!-- E 本地调试 -->

</head>
<body>

</body>
</html>

游鱼的博客

html meta标签