HTML5关键知识点之＜head＞元素深度剖析

奋斗的小羊羊

于 2025-05-16 20:42:22 发布

阅读量1.2k

点赞数 15

文章标签： html5 前端 html

本文链接：https://blog.csdn.net/2301_78506709/article/details/148016830

版权

HTML5关键知识点之元素深度剖析

在前端开发的学习中，HTML5有着丰富且实用的知识。我写这篇文章，就是想和大家一起深入学习这些内容，共同提升我们的前端开发技能。

字符编码：字符编码是电脑存储和显示文字的关键，它为屏幕显示内容和电脑存储内容提供映射。确定网页字符编码有两种方式，一是通过HTTP头信息Content-Type指定，二是在HTML文件中用<meta>标签声明。HTML5中<meta charset="utf-8"/>这种更简洁的声明方式适用于所有浏览器，且HTTP头信息指定的编码会覆盖<meta>标签的设置。每个HTML页面都应指定字符编码，否则可能存在安全漏洞。
链接关系：链接关系用于解释链接到其他页面的原因，HTML5的链接关系分为外部资源链接和超链接两类。外部资源链接引入加强当前文档的资源，超链接指向其他文档。链接关系大多在页面<head>区域的<link>元素中设置，部分也可用于<a>和<area>元素。常见的链接关系有rel="stylesheet"（指向CSS样式表文件，在HTML5中可省略type属性）和rel="alternate"（配合特定type属性值，可开启聚合内容自动发现机制）。新的链接关系需遵循WHAT工作小组的审核和认可程序。

字符编码（重点）：电脑处理文字时，实际上处理的是位和字节，字符编码就像是一个“翻译官”，把电脑存储的内容变成我们能看懂的文字显示在屏幕上。确定网页用什么“翻译规则”（字符编码）有两个办法，一是服务器通过HTTP头信息告诉浏览器，二是在网页代码里用<meta>标签说明。HTML5里有个更简单的写法<meta charset="utf-8"/>。一定要给每个网页指定字符编码，不然可能会有安全问题，就像房子没锁好门，容易被坏人钻空子。
链接关系（重点）：平常的链接只是把我们带到另一个网页，链接关系则是告诉我们为什么要去那个网页。它分为两种，一种是给当前网页“送装备”（引入资源）的外部资源链接，另一种是指向其他网页的超链接。这些链接关系一般写在网页的<head>部分的<link>标签里。比如rel="stylesheet"，就是告诉浏览器去拿一个CSS样式表文件来打扮这个网页，在HTML5里连type属性都可以不用写；rel="alternate"配合一些特定的type属性值，像application/atom+xml，就能让像Google Reader这样的软件自动找到网站的最新内容，方便我们阅读。不过，要是想自己添加新的链接关系，得经过WHAT工作小组同意才行。

知识点	描述	关键细节
字符编码	字符编码是电脑处理文字的关键，有多种指定网页字符编码的方式	HTML5中`<meta charset="utf-8"/>`可声明编码，HTTP头信息优先，每个页面都应指定编码
链接关系	用于解释链接目的，分为外部资源链接和超链接两类	常见于`<head>`区域的`<link>`元素，`rel="stylesheet"`可省略`type`属性，`rel="alternate"`可开启内容自动发现机制，新链接关系需审核