PC端meta标签
下面介绍meta标签的几个属性,charset,content,http-equiv,name。
一、charset
此特性声明当前文档所使用的字符编码,但该声明可以被任何一个元素的lang特性的值覆盖,此特性的值必须是一个符合由IANA所定义的字符编码首选MIME名称之一,鼓励使用UTF-8。
二、content
基于内容,这个属性为http-equiv或name属性提供了与其相关的值的定义。
三、http-equiv
equiv的全称是"equivalent",意思是相等,相当于。定义http-equiv相当于http的作用。
meta标签中http-equiv属性语法格式是:
<meta http-equiv="参数" content="具体的描述">
http-equiv属性主要有以下几种参数:
1、content-Type(设定网页字符集)
<meta http-equiv="content-Type" content="text/html;charset=utf-8"> //旧的HTML,不推荐
<meta charset="utf-8"> //HTML5设定网页字符集的方式
2、X-UA-Compatible(浏览器采取何种版本渲染当前页面)
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/> //指定IE和Chrome使用最新版本渲染当前页面
3、cache-control(指定请求和响应遵循的缓存机制)
<meta http-equiv="cache-control" content="no-cache">
no-cache: 先发送请求,与服务器确认该资源是否被更改,如果未被更改,则使用缓存。
no-store: 不允许缓存,每次都要去服务器上,下载完整的响应。(安全措施)
public: 缓存所有响应,但并非必须,因为max-age也可以做到相同效果。
private: 只为单个用户缓存,因此不允许任何中继进行缓存。(比如说CDN就不允许缓存private的响应)
maxage: 表示当前请求开始,该响应在多久内能被缓存和重用,而不去服务器重新请求。
<meta http-equiv="Cache-Control" content="no-siteapp" />//禁止百度自动转码
4、expires(网页到期时间)
<meta http-equiv="expires" content="Sunday 26 October 2011 01:00 GMT" />
5、refresh(自动刷新并指向某页面)
<meta http-equiv="refresh" content="2;URL=http://www.cnblogs.com/camille666/"> //2秒后跳转向我的博客
6、Set-Cookie(cookie设定)
如果网页过期 ,那么这个网页存在本地的cookies也会被自动删除。
<meta http-equiv="Set-Cookie" content="name, date"> //格式
<meta http-equiv="Set-Cookie" content="User=camille; path=/; expires=Sunday, 10-Jan-11 10:00:00 GMT"> //具体范例
7、网页过渡效果
<meta http-equiv=”page-Enter” contect=”revealTrans(duration=时间(秒),transition=效果)”/>
<meta http-equiv=”page-Exit” contect=”revealTrans(duration=时间;transition=效果)”/> 0~23种效果
四、name
meta标签中name属性语法格式是:
<meta name="参数" content="具体的描述">
name属性主要有以下几种参数:
1、keywords(关键字)
<meta name="keywords" content="camille,计算机,软件工程">
2、description(网站内容的描述)
<meta name="description" content="camille,计算机,软件工程">
3、viewport(移动端的窗口)
<meta name="viewport" content="width=device-width, initial-scale=1">
4、robots(定义搜索引擎爬虫的索引方式)
说明:robots用来告诉爬虫哪些页面需要索引,哪些页面不需要索引。content的参数有all,none,index,noindex,follow,nofollow。默认是all。
<meta name="robots" content="none">
none : 搜索引擎将忽略此网页,等价于noindex,nofollow。
noindex : 搜索引擎不索引此网页。
nofollow: 搜索引擎不继续通过此网页的链接索引搜索其它的网页。
all : 搜索引擎将索引此网页与继续通过此网页的链接索引,等价于index,follow。
index : 搜索引擎索引此网页。
follow : 搜索引擎继续通过此网页的链接索引搜索其它的网页。
5、author(作者)
<meta name="author" content="camille">
6、generator(网页制作软件)
<meta name="generator" content="Sublime Text3">
7、copyright(版权)
<meta name="copyright" content="camille">
8、revisit-after(搜索引擎爬虫重访时间)
<meta name="revisit-after" content="7 days">
9、renderer(双核浏览器渲染方式)
<meta name="renderer" content="webkit"> //默认webkit内核
<meta name="renderer" content="ie-comp"> //默认IE兼容模式
<meta name="renderer" content="ie-stand"> //默认IE标准模式
10、referrer
<meta name="referrer" content="never">
never: 如果referer-policy的值为never,删除 http head中的referer;
default: 如果referer-policy的值为default,如果当前页面使用的是https协议,而正要加载的资源使用的是普通的http协议,则将 http header中的referer置空;
origin: 如果referer-policy的值为origin,只发送origin部分;
always: 如果referer-policy的值为always,不改变http header中的 referer 的值。这种情况下,如果当前页面使用了https协议,而要加载的资源使用的是http协议,加载资源的请求头中也会携带referer。
PC端meta标签的更多相关文章
- 移动端meta标签设置
移动端meta标签设置 1.设置当前html文件的字符编码 <meta charset="UTF-8"> 1 2设置浏览器的兼容模式(让IE使用最新的浏览器渲染) &l ...
- 移动端meta标签整理-备
分类 在介绍移动端特有 meta 标签之前,先简单说一下 HTML meta 标签的一些知识. meta 标签包含了 HTTP 标题信息 (http-equiv) 和 页面描述信息 (name). h ...
- 移动端——meta标签
meta标签主要辅助HTML结构层的.meta标签不管在互联网前端还是在移动端都起了很重要的作用. <meta http-equiv="Content-type" conte ...
- 移动端 :meta标签1万个作用
meta标签 <meta charset="utf-8"> <meta http-equiv="Content-Type" content=& ...
- 移动端 meta 标签笔记
(转自http://www.cssue.com/xhtml-css/html5-css3/mobile-meta.html,版权归原作者所有!) 移动平台对 meta 标签的定义 一.meta 标签分 ...
- 移动端meta标签
现在的手机或平板电脑等移动设备上的浏览器默认都有双击放大的设置,如何阻止双击放大?user-scalable=no <!-- 禁止缩放 --> <meta name=”viewpor ...
- 移动端meta标签缓存设置
1.<meta charset="utf-8"> 2.<meta content="width=device-width, initial-scale= ...
- 移动端meta标签的使用和设置
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale= ...
- 移动端meta标签的设置
var phoneWidth = parseInt(window.screen.width); var phoneScale = phoneWidth / 640; var ua = navigato ...
随机推荐
- duilib踩坑记录
duilib官方 https://github.com/duilib/duilib duilib他人扩展 https://github.com/qdtroy/DuiLib_Ultimate 关于两者的 ...
- Python中的列表解析和生成器表达式
Python中的列表解析和生成器表达式 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.列表解析案例 #!/usr/bin/env python #_*_coding:utf-8 ...
- [Java] Servlet工作原理之二:Session与Cookie
(未完成) 一.Cookie与Session的使用简介 1 Cookie Cookie 用于记录用户在一段时间内的行为,它有两个版本:Version 0 和 Version 1,分别对应两种响应头 S ...
- nginx配置自动跳转
阅读更多 希望实现的效果是,用户只要访问域名,自动跳转到index.html页面 原本配置为: location / { root /users/apple/git_local/YAE/YAE/f ...
- 浏览器存储:cookie
Cookie是什么:cookie是指存储在用户本地终端上的数据,同时它是与具体的web页面或者站点相关的.Cookie数据会自动在web浏览器和web服务器之间传输,也就是说HTTP请求发送时,会把保 ...
- 让你的HTML5&CSS3网站在老IE中也能正常显示的3种方法
起初,IE其实也是一款非常有进取心的浏览器.但经过一段时间的蛰伏后,它已经成为了我们生活中的一道障碍.微软现在又重新开始向其它浏览器发起挑战,但事实情况是,新版的现代IE浏览器一直滞后于谷歌浏览器和火 ...
- phpStorm 8.0.3 设置
phpstorm 8 license key Learn Programming===== LICENSE BEGIN =====63758-1204201000000Ryqh0NCC73lpRm!X ...
- sql查询语句优化
http://www.cnblogs.com/dubing/archive/2011/12/09/2278090.html 最近公司来一个非常虎的dba 10几年的经验 这里就称之为蔡老师吧 在征得 ...
- unbind()清除指定元素绑定效果
定义和用法 unbind() 方法移除被选元素的事件处理程序. 该方法能够移除所有的或被选的事件处理程序,或者当事件发生时终止指定函数的运行. ubind() 适用于任何通过 jQuery 附加的事件 ...
- 训练赛第二场E题 Cottage Village
题目大意:在一条X轴上,有若干个正方形,并且保证这些正方形的中心都在X轴上,然后输入n个正方形的中心的X坐标,和正方形的边长,现在要再插入一个正方形,要求是,新插入的正方形至少要有一条边与原来的正方形 ...