这是我参与更文挑战的第1天，活动详情查看：更文挑战
HTML之<‘meta’>标签
元数据
首先需要了解一下元数据(metadata)元素的概念，用来构建HTML文档的基本结构，以及就如何处理文档向浏览器提供信息和指示，它们本身不是文档内容，但提供了关于后面文档内容的信息。
如title、base、meta都是元数据元素。本文主要介绍<meta>。
<meta>元素
元素可以定义文档的各种元数据，提供各种文档信息，通俗点说就是可以理解为提供了关于网站的各种信息。html文档中可以包含多个元素，每个元素只能用于一种用途，如果想定义多个文档信息，则需要在head标签中添加多个meta元素。
| 元素 | meta |
|---|---|
| 父元素 | head |
| 属性 | http-equiv、name、content、charset |
| HTML5中的变化 | 1. charset为HTML5中新增的，用来声明字符编码; 2. http-equiv属性在HTML4中有很多值，在HTML5中只有refresh、default-style、content-type可用 |
<meta>具体用途
元素出去charset属性外，都是http-equiv属性或name属性结合content来使用
1. 指定名/值对定义元数据
name属性与content属性结合使用, name用来表示元数据的类型，表示当前<meta>标签的具体作用；content属性用来提供值。
<meta name="参数" content="具体描述信息">
| 元数据名称(name的值) | 说明 |
|---|---|
| application-name | 当前页所属Web应用系统的名称 |
| keywords | 描述网站内容的关键词,以逗号隔开，用于SEO搜索，一般不超过100个字符 |
| generator | 包含生成页面的软件的标识符。 |
| description | 当前页的说明，一般不超过200个字符 |
| author | 当前页的作者名 |
| copyright | 版权信息 |
| renderer | renderer是为双核浏览器准备的，用于指定双核浏览器默认以何种方式渲染页面 |
| viewport | 它提供有关视口初始大小的提示，仅供移动设备使用 |
2. renderer
<meta name="renderer" content="webkit"> // 默认webkit内核
<meta name="renderer" content="ie-comp"> // 默认IE兼容模式
<meta name="renderer" content="ie-stand"> // 默认IE标准模式
<meta name="renderer" content="webkit|ie-comp|ie-stand">
3. 声明字符编码
charset属性为HTML5新增的属性，用于声明字符编码,以下两种写法效果一样
<meta charset="utf-8"> //HTML5
<meta http-equiv="content-Type" content="text/html;charset=utf-8"> //旧的HTML
4. viewreport
- content内容为空时，默认视口宽度为980
- content设置width，不设置initail-scale时，视口宽度为设置的width值
- content不设置width，只设置initail-scale时，是可以根据initail-scale的值计算出视口的宽度
initail-scale = 屏幕宽度 / 视口宽度
- content同时设置width和initail-scale时，视口宽度为width的值，页面显示按照initail-scale比率进行缩放
- 一般都是进行如下设置，来实现视口宽等于设备宽，布局完成后屏幕显示也不进行缩放
<meta name="viewport" content="width=device-width, initial-scale=1.0">
