meta标签常见属性详细介绍

<meta> 标签

一.介绍

      <meta> 标签定义关于 HTML 文档的元数据。元数据是关于数据的数据（信息）。
      元数据不会显示在页面上，但可以被机器解析。
      浏览器（如何显示内容或重新加载页面）,搜索引擎（关键词）和其他网络服务会用到元数据。
注意：现在已不再使用 meta 元素来指定网页所用的语言

二.meta 元素有三种典型的用法：

1. 声明字符编码

<!-- 配置字符编码 -->
	<meta charset="UTF-8">

2. 模拟 HTTP 标头字段:

（1） 若有一天用户用的是IE8及以上版本的浏览器，有下面这行代码，他会通知IE进入一个edge的渲染模式，能更好的呈现网页

 <!-- 针对IE浏览器的一个兼容性设置  -->
     <meta http-equiv="X-UA-Compatible" content="IE=edge">

（2）自动刷新

<!-- 使用 http-equiv 属性和 content 属性，每 30 秒原地刷新 -->
    <meta http-equiv="refresh" content="30">
<!-- 使用 http-equiv 属性和 content 属性，10秒跳转百度，这种跳转地址栏没有办法进行后退的 -->
    <meta http-equiv="refresh" content="10; url='https://www.baidu.com'">

    注：url 属性应该包含在 content 属性的值中，并且需要用分号和空格分隔。

3. 指定名/值元数据对

（1）设置视口，改善网站在各种设备上的外观,它为浏览器提供了关于如何控制页面尺寸和缩放比例的指令。
   width=device-width 部分将页面的宽度设置为跟随设备的屏幕宽度（视设备而定）。
   当浏览器首次加载页面时，initial-scale=1.0 部分设置初始缩放级别。

 <!-- 针对移动端的配置 -->
      <meta name="viewport" content="width=device-width, initial-scale=1.0">

（2） 为搜索引擎定义关键字：搜索引擎看到下一行代码，用户搜索content内的词语时，此网页就会出现在搜索结果里

 <!-- 配置网页的关键字,以英文逗号隔开的单词/词语 -->
      <meta name="keyword" content="前端 html css">

（3）对网页做一个简介，这个网站是干什么的

 <!-- 定义有关网页的描述 -->
     <meta name="description" content="与网站内容相关">

（4）以下部分可以做个了解

 <!-- 定义页面的作者： -->
     <meta name="author" content="m0_46687651">

 <!-- 配置网页生成工具 网页是用什么工具写的-->
     <meta name="generator" content="Visual Studio Code">

 <!-- 定义网页版权信息 -->
     <meta name="copyright" content="m0_46687651©版权所有">

想了解更详细的<meta> 标签，可以访问:
https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/meta