摘要：元信息类标签，就是用于描述文档自身的一类标签。二标签作为盛放其它语义类标签的容器使用。五标签标签是一组键值对，它是一种通用的元信息表示标签。具有属性的具有属性的标签，表示执行一个命令，可以不需要属性。
笔记说明
重学前端是程劭非（winter）【前手机淘宝前端负责人】在极客时间开的一个专栏，每天10分钟，重构你的前端知识体系，笔者主要整理学习过程的一些要点笔记以及感悟，完整的可以加入winter的专栏学习【原文有winter的语音】，如有侵权请联系我，邮箱：kaimo313@foxmail.com。一、什么是元信息类标签
元信息，是指描述自身的信息。元信息类标签，就是 HTML 用于描述文档自身的一类标签。二、head 标签
作为盛放其它语义类标签的容器使用。2.1、注意
1、head 标签规定了自身必须是 html 标签中的第一个标签，它的内容必须包含一个 title，并且最多只能包含一个 base。
2、如果文档作为 iframe，或者有其他方式指定了文档标题时，可以允许不包含 title 标签。
三、title 标签title 标签表示文档的标题，title 应该完整地概括整个网页内容的。四、base 标签
base 标签作用是给页面上所有的 URL 相对地址提供一个基础。
上面的代码里面a标签的属性href没有值，但是当你点击极客时间，它就会新开一个页面打开base标签里的href。
五、meta 标签meta 标签是一组键值对，它是一种通用的元信息表示标签。5.1、具有 charset 属性的 meta
HTML5开始 meta标签新增 charset 属性的 meta 标签无需再有 name 和 content。
charset 型 meta 标签非常关键，它描述了 HTML 文档自身的编码形式。建议放在 head 的第一个。
……
5.2、具有 http-equiv 属性的 meta
具有 http-equiv 属性的 meta 标签，表示执行一个命令，可以不需要 name 属性。
其他命令：
content-language：指定内容的语言
default-style：指定默认样式表
refresh：刷新
set-cookie：模拟 http 头 set-cookie，设置 cookie
x-ua-compatible：模拟 http 头 x-ua-compatible，声明 ua 兼容性
content-security-policy：模拟 http 头 content-security-policy，声明内容安全策略
5.3、name 为 viewport 的 metawidth：页面宽度，可以取值具体的数字，也可以是 device-width，表示跟设备宽度相等。
height：页面高度，可以取值具体的数字，也可以是 device-height，表示跟设备高度相等。
initial-scale：初始缩放比例
minimum-scale：最小缩放比例
maximum-scale：最大缩放比例
user-scalable：是否允许用户缩放
做好了移动端适配的网页，应该把用户缩放功能禁止掉，宽度设为设备宽度
5.4、其它预定义的 metaapplication-name：如果页面是 Web application，用这个标签表示应用名称。
author: 页面作者
description：页面描述，用于搜索引擎或者其它场合
generator: 生成页面所使用的工具，主要用于可视化编辑器，如果是手写 HTML 的网页，不需要加这个 meta
keywords: 页面关键字，对于 SEO 场景非常关键
referrer: 跳转策略，是一种安全考量
theme-color: 页面风格颜色，实际并不会影响页面，但是浏览器可能据此调整页面之外的 UI（如窗口边框或者 tab 的颜色）
补充：
个人总结
关于这一块在业务中确实关注比较少，base标签也是看了winter这篇文章才知道的，加油加油才行。。。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/55035.html
摘要：元信息类标签，就是用于描述文档自身的一类标签。二标签作为盛放其它语义类标签的容器使用。五标签标签是一组键值对，它是一种通用的元信息表示标签。具有属性的具有属性的标签，表示执行一个命令，可以不需要属性。 笔记说明 重学前端是程劭非（winter）【前手机淘宝前端负责人】在极客时间开的一个专栏，每天10分钟，重构你的前端知识体系，笔者主要整理学习过程的一些要点笔记以及感悟，完整的可以加入w...
摘要：元信息类标签，就是用于描述文档自身的一类标签。二标签作为盛放其它语义类标签的容器使用。五标签标签是一组键值对，它是一种通用的元信息表示标签。具有属性的具有属性的标签，表示执行一个命令，可以不需要属性。 笔记说明 重学前端是程劭非（winter）【前手机淘宝前端负责人】在极客时间开的一个专栏，每天10分钟，重构你的前端知识体系，笔者主要整理学习过程的一些要点笔记以及感悟，完整的可以加入w...
摘要：二标签超链接型标签超链接型标签是一种被动型链接。四标签与标签非常相似，不同的是，它不是文本型的链接，而是区域型的链接。是整个规则中唯一支持非矩形热区的标签。 笔记说明 重学前端是程劭非（winter）【前手机淘宝前端负责人】在极客时间开的一个专栏，每天10分钟，重构你的前端知识体系，笔者主要整理学习过程的一些要点笔记以及感悟，完整的可以加入winter的专栏学习【原文有winter的语...
摘要：二标签超链接型标签超链接型标签是一种被动型链接。四标签与标签非常相似，不同的是，它不是文本型的链接，而是区域型的链接。是整个规则中唯一支持非矩形热区的标签。 笔记说明 重学前端是程劭非（winter）【前手机淘宝前端负责人】在极客时间开的一个专栏，每天10分钟，重构你的前端知识体系，笔者主要整理学习过程的一些要点笔记以及感悟，完整的可以加入winter的专栏学习【原文有winter的语...
阅读 779·2023-04-25 22:57
阅读 3020·2021-11-23 10:03
阅读 593·2021-11-22 15:24
阅读 3136·2021-11-02 14:47
阅读 2878·2021-09-10 11:23
阅读 3096·2021-09-06 15:00
阅读 3895·2019-08-30 15:56
阅读 3305·2019-08-30 15:52
