作为一个前端，经常写html文档，但是却很少去在意头部的标签有哪些，也很少在意每个标签的作用，下面我们来详细了解下。
头部的标签，也就是写在<head><head/>里。通常会有6个标签：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>文档标题</title> <base href="http://www.runoob.com/images/" target="_blank"> <link rel="stylesheet" type="text/css" href="mystyle.css"> <style type="text/css"> body {font-size:16px} p {color:blue} </style> <script> document.write("Hello World!") </script> </head> <body> 文档内容...... </body> </html>
一、<title>元素。
1.title 标签定义了文档的标题，在HTML文档中是必须的。它会展示在浏览器的工具栏上。
2.如果要展示一个图标，可以再加一个<link>标签，<link>标签的 rel属性为“icon”,后面的href跟上图片的地址。
<link rel="icon" href="图片url">
二、<base>元素。
base标签描述了基本的链接地址，该标签作为HTML文档中所有的链接的默认链接
<head> <base href="http://www.php.cn/tpl/Index/Static/img/" target="_blank" />
</head>
<body>
<img src="banner7.jpg"/>
</body>
上面的img标签的src链接的地址就是base里的地址加上img里的地址。
三、<link>元素。
link标签定义了文档与外部资源之间的关系，它通常用于链接到样式表。
<head> <link rel="stylesheet" type="text/css" href="style.css"> </head>
四、<style>元素。
style标签定义了HTML文档的样式，这个我们经常会使用到，都不会陌生。
五、<meta>元素。
meta标签提供了元数据.元数据也不显示在页面上，但会被浏览器解析。它常用于指定网页的描述，关键词，文件的最后修改时间，作者，和其他元数据。
元数据可以使用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他Web服务。这个更详细 ：https://blog.csdn.net/weixin_45456533/article/details/109825808
// 编码格式定义
<meta charset="utf-8">
// 为搜索引擎定义关键词:
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
// 为网页定义描述内容: <meta name="description" content="头部标签 & 使用">
// 定义网页作者: <meta name="author" content="Runoob">
// 每30秒钟刷新当前页面: <meta http-equiv="refresh" content="30">
// 视图层的参数定义
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
/>
content属性值 :
可视区域的宽度，值可为数字或关键词device-width
height:同width
intial-scale:页面首次被显示是可视区域的缩放级别，取值1.0则页面按实际尺寸显示，无任何缩放
maximum-scale=1.0, minimum-scale=1.0;可视区域的缩放级别，
maximum-scale用户可将页面放大的程序，1.0将禁止用户放大到实际尺寸之上。
user-scalable:是否可对页面进行缩放，no 禁止缩放
// referer定义
在某些情况下，出于一些原因，网站想要控制页面发送给 server 的 referer 信息的情况下，可以使用这一 referer metadata 参数。
参数
referer 的 metedata 属性可设置content属性值为以下集合：
- never
- always
- origin
结果
- 如果referer-policy的值为never：删除http head中的referer；
- 如果referer-policy的值为default：如果当前页面使用的是https协议，而正要加载资源使用的是普通的http协议，则将http header中额referer置为空；
- 如果referer-policy的值origin：只发送origin部分；
- 如果referer-policy的值为always：不改变http header中的referer的值；
举例
如果页面中包含了如下 meta 标签，所有从当前页面中发起的请求将不会携带 referer：<meta name="referrer" content="never">
如果页面中包含了如下 meta 标签，则从当前页面中发起的 http请求将只携带 origin 部分：<meta name="referrer" content="origin">
六、<script>元素。
script标签用于加载脚本文件，比如说javascript,可以直接书写js,也能用于链接外部的js文件。
<script> document.write("Hello World!") </script>
// or
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>