常用meta详解
<meta charset="utf-8">
作用:中文
<meta name=”description” content=”不超过150个字符”/>
所用: 描述页面
<meta name=”keywords” content=””/>
作用: 设置页面关键词
<meta name=”robots” content=”all|none|index|noindex|follow|nofollow”/>
作用: 搜索引擎抓取
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
传统web页面宽度在980,手机端应用上需要修改vierport,几种属性值可以设置如下:
- width: viewport 的宽度 (范围从 200 到 10,000 ,默认为 980 像素 )
- height: viewport 的高度 (范围从 223 到 10,000 )
- initial-scale: 初始的缩放比例 (范围从>0到 10 )
- minimum-scale: 允许用户缩放到的最小比例
- maximum-scale: 允许用户缩放到的最大比例
- user-scalable: 用户是否可以手动缩放
<meta name="format-detection" content="telephone=no, email=no" />
content可以设置为:
- telephone=no: 禁止把数字转化为拨号链接
- email=no : 禁止转化页面中的邮箱格式为邮箱
<meta name=”author” contect=”name, xxx@163.com” />
作用:设置作者姓名及联系方式
<meta name="”apple-mobile-web-app-capable”" content="”yes”">
作用:删除默认的苹果工具栏和菜单栏,yes表示删除,no默认显示,可以不添加该meta
<meta name="”apple-mobile-web-app-status-bar-style”" content="”default”">
作用:控制状态栏显示样式,content属性设置如下:
- default( 默认白色)
- black (黑色)
- black-translucent(灰色半透明),将会占据页面px位置,浮在页面上方(会覆盖页面20px高度–iphone4和itouch4的Retina屏幕为40px)。
<meta name="apple-touch-fullscreen" content="yes">
作用:添加到主屏幕后全屏显示
<meta name="apple-itunes-app" content="app-id=51090950,app-argument=fleamarket://home1">
作用:告诉iphone的safari浏览器,这个网站对应的app是什么,然后在页面上面显示一个banner图片。
<meta http-equiv="content-type" content="text/html; charset=gb2312">
http-equiv : 把content属性关联到HTTP,如果没有提供name属性,content的值会对应http-equiv属性
- content-type :charset定义字符集,告诉服务器响应的格式,Accept-charset则告诉服务器,发送给服务器的内容可能的编码。
- charset
- expires: content=”31 Dec 2008”表示存在时间,在这时间之前不去发送请求,GMT格式
- refresh: content=”5;url=http://xxx.com” 表示5秒后重定向到新链接,若无网址字段则每5秒刷新
- set-cookie: content=”Mon,12 May 2001 00:20:00 GMT”如果存盘的cookie过期就被删掉,GMT格式
- Pragma(cache模式) :禁止浏览器从本地计算机的缓存中访问页面内容。
- Cache-Control: 指定请求和响应遵循的缓存机制。请求时缓存指令: content=”no-cache|no-store|max-age|max-stale|min-fresh|on”,相应时指令: content=”public|private|no-cache|no-store|no-transform|must-revalidate|proxy-revalidate|max-age”
- Public指示响应可被任何缓存区缓存
- Private指示对于单个用户的整个或部分响应消息,不能被共享缓存处理。这允许服务器仅仅描述当用户的部分响应消息,此响应消息对于其他用户的请求无效
- no-cache指示请求或响应消息不能缓存
- no-store用于防止重要的信息被无意的发布。在请求消息中发送将使得请求和响应消息都不使用缓 - 存。
- max-age指示客户机可以接收生存期不大于指定时间(以秒为单位)的响应
- min-fresh指示客户机可以接收响应时间小于当前时间加上指定时间的响应
- max-stale指示客户机可以接收超出超时期间的响应消息。如果指定max-stale消息的值,那么客户机可以接收超出超时期指定值之内的响应消息。