HTML中的meta标签常用属性及作用

文章参考: HTML meta标签总结与属性使用介绍和 HTML中的meta标签常用属性及其作用总结

在html中，我们总免不了跟meta标签打交道，以前只是有一些简单的了解，作为html中必不可少的一部分，还是需要更深入的理解下。

元素

元素可以提供有关页面的元信息，比如针对搜索引擎和搜索引擎更新频度的描述和关键词。每个元素只能用于一种用途，如果想定义多个文档信息，则需要在head标签中添加多个meta元素。

属性（name和http-equiv）

name属性主要用于描述网页，比如网页关键词，叙述等。与之对应的属性值为content，content中的内容是对name填入类型的具体描述，便于搜索引擎抓取。
词法格式：

参数：

keywords(关键字)
说明：告诉搜索引擎网页的关键字。
例如:
```
    
```
description(网站内容的描述)
说明: 告诉搜索引擎网站的主要内容
例如:
```
  
```
robots(定义搜索引擎爬虫的索引方式)
说明: robots用来告诉爬虫哪些页面需要索引，哪些页面不需要索引。
content的参数有all,none,index,noindex,follow,nofollow。默认是all。
例如：
```
    
```
具体参数如下：
- none : 搜索引擎将忽略此网页，等价于noindex，nofollow。
- noindex : 搜索引擎不索引此网页。
- nofollow: 搜索引擎不继续通过此网页的链接索引搜索其它的网页。
- all : 搜索引擎将索引此网页与继续通过此网页的链接索引，等价于index，follow。
- index : 搜索引擎索引此网页。
- follow : 搜索引擎继续通过此网页的链接索引搜索其它的网页。
author(作者)
说明：用于标注网页作者
例如：
```
    
```
copyright(版权)
说明：用于标注版权信息
例如:
```
  
```
revisit-after(搜索引擎爬虫重访时间)
说明：如果页面不是经常更新，为了减轻搜索引擎爬虫对服务器带来的压力，可以设置一个爬虫的重访时间。如果重访时间过短，爬虫将按它们定义的默认时间来访问。
例如：

renderer(双核浏览器渲染方式)
说明：renderer是为双核浏览器准备的，用于指定双核浏览器默认以何种方式渲染页面。比如说360浏览器。
例如：
```
    //默认webkit内核
    //默认IE兼容模式
    //默认IE标准模式
```
viewport(移动端视口)
- viewport提供有关视口初始大小的提示，仅供移动设备使用。
  例如：
```
    meta name="viewport" content="width=device-width, initial-scale=1">
```
  content内容：
  - width，可能为一个正整数或者字符串"device-width",以像素为单位i，定义viewport(视口)的宽度。
  - height，可能为一个正整数或者字符串"device-width",以像素为单位i，定义viewport(视口)的高度。
  - initial-scale，一个0.0到10.0之间的正数，定义设备宽度(纵向模式下的设备宽度或横向模式下的设备高度)与视口大小之间的缩放比例。
  - maximum-scale，一个0.0到10.0之间的正数，定义缩放的最大值，它必须大于或等于minimum-scale的值，不然会导致不确定的行为发生。
  - minimum-scale，一个0.0到10.0之间的正数，定义缩放的最小值，它必须小于或等于maximum-scale的值，不然会导致不确定的行为发生。
  - user-scalable，一个布尔值(yes或no)，如果设置为no，用户将不能放大或缩小网页，默认值是yes。
  - 如果不设置viewport，默认视口宽度是980
  - content设置width，不设置initial-scale，视口宽度为设置的width值
  - content内容为空时，默认视口宽度是980
  - content设置initial-scale但是不设置width，可以根据initial-scale计算出视口宽度
    initial-scale = 屏幕宽度/视口宽度

http-equiv属性
http-equiv属性指定所要模拟的标头字段的名称，content属性用来提供值。

content-Type声明网页字符编码:

  
  // html5中

refresh指定一个时间间隔(以秒为单位)，在此时间过去之后从服务器重新载入当前页面，也可以另外指定一个页面。

    // 2s后从当前页跳转到百度

X-UA-Compatible浏览器采用何种版本渲染当前页面。

    // 指定IE和chorme使用最新版本渲染当前页面

expires用于设定网页的到期时间，过期后网页必须到服务器上重新传输

catch-control 用于指定所有缓存机制在整个请求/响应链中必须服从的指令

content有以下值：

content值	说明
public	所有内容都将被缓存(客户端和代理服务器都可缓存)
private	内容只缓存到私有缓存中（仅客户端可以缓存，代理服务器不可缓存）
no-cache	必须先与服务器确认返回的响应是否被更改，如果存在合适的验证令牌(ETag),no-cache会发起往返通信来验证缓存的响应，如果资源未被修改，直接使用缓存，如果修改了则从服务器获取。
no-store	所有内容都不会被缓存，每次都需要去浏览器上获取资源
must-revalidation/proxy-revalidation	如果缓存的内容失效，请求必须发送到服务器/代理以进行重新验证。
max-age	设置内容失效时间，用于HTTP1.1,如果和Last-Modified一起使用，优先级要高

HTML中的meta标签常用属性及作用

元素

属性（name和http-equiv）

使用meta标签清除页面缓存

你可能感兴趣的:(HTML中的meta标签常用属性及作用)