html文档里head这些作用你还真不一定知道!

大家知道一个标准的html文档都是要有一个head头部的，一般用于写编码方式，文档标题，引入外部资源等这些基本功能，事实上，它还能做很多别的事情。。。

1. 打印样式表

   当然是对于可打印页面，可以提供针对打印机的样式表。

   <link rel="stylesheet" href="/css/print.css" media="print">

2. 交替样式表

   定义交替样式表的时候，指定其 title 属性，以方便用户在浏览器中根据名称选择替代样式（多用于多主题切换的站点）。

   <link href="default.css" rel="stylesheet">

   <link href="high-contrast.css" rel="alternate stylesheet" title="High contrast">

3. 固定链接

   对于一份文档存在多个 URL 的情况，通过 rel="canonical" 指定唯一的固定链接。

   <link rel="canonical" href="www.xxx.html">

   对于支持 RSS 订阅的页面，可针对 RSS 阅读器提供可订阅的源文件。

   <link rel="alternative" href="/index.xml" title="xxx博客" type="application/atom+xml">

4. Facebook Open Graph

   Open Graph 是一套开放的网页标注协议，通过 meta 标签标注网页的类型，主要由 Facebook 推动，已经成为社交分享领域的事实标准。如果你希望明确告诉社交网络或搜索引擎你的网页类型，你应该添加这些 meta 标签。

   <meta property="og:type" content="article">

   <meta property="og:title" content="此处为分享标题">

   <meta property="og:description" content="此处为分享描述">

   <meta property="og:image" content="此处为分享配图">

   <meta property="og:url" content="此处为分享的链接地址">

5. 预请求

   指示浏览器预先请求用户即将浏览页面所需要的关键性资源。

   <link rel="prefetch" href="/img/css-sprite.png">

   <link rel="prefetch" href="/fonts/icons.woff2">