meta 标签表示的是一种元属性 它不会对页面的布局造成影响
但是我们的页面离不开 meta 标签 合理的编写 meta 标签 也会让我们的页面有更好的体验
本文主要罗列一些常用到的 meta 标签的属性
charset
<!-- 指定网页的编码方式 -->
<meta charset="UTF-8" />
http-equiv
<!-- 编译指令,提供的信息与类似命名的 HTTP 头部相同 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!-- 1s后刷新页面 -->
<meta http-equiv="refresh" content="1" />
<!-- 1s后跳转/重定向 -->
<meta
http-equiv="refresh"
content="1;URL='https://juejin.cn/user/1574156383563496'"
/>
name
name属性表示元数据的名字,content属性表示元数据的值。它们合在一起使用,就可以为网页指定一项元数据
viewport
<!-- 适配移动端 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
一些SEO优化
<!-- SEO优化 -->
<meta name="description" content="meta description" />
<meta name="keywords" content="html" />
<meta name="author" content="chou" />
OGP
OGP 是一种为社交分享而生协议 拿 Microsoft 官网举例
当我们在分享该网站的时候 就会显示对应 meta 信息中 og: 相应的内容
具体有关 OGP 的内容可以参考