也许你会说，就是一个HTML标签讲解，哪里有什么炼狱解读。所谓炼狱，是一个过程的解读。web前端技术需要的就是一个过程，这个过程必然是如同经历地狱一般，只有体验过炼狱滋味，才可以接受web前端技术的真谛。
随便打开一个网页，右击查看网页源代码，总能看到<head>…</head>封闭标签，在里面通常会包含5类标签：title、link、script、meta、style。这5类标签看着都挺熟悉的哈，那么在web前端技术中具体要怎么使用，规则是什么，在我学习的时侯，我做了笔记整理，希望有帮助。
附上一张头部完整源码效果展示：
1. title 标签
title是一个封闭标签，在head中是成对出现。也就是<title>…</title>。在打开一个网页时，网页上方的文字就是title部分。
Title是对整个页面的核心思想的总结，也是seo非常重要的设置部分。Title部分尽量要多次出现关键词：核心关键词和长尾关键词。具体怎么写title部分，根据需求而定。这个没有标准。
<title>…</title>放在<head>…</head>标签中。注意用法写法。
2. link 标签
Link标签放置在<head>…</head>中，作用是链接外部css文件和收藏夹图标。最常用的用法是链接外部样式表，也就是css文件。link写法是“<link … />”
例如：
2.1 引入外部css样式：<link href="style/style.css" rel="stylesheet" type="text/css" />
设置网站小图标（收藏图标）：<link rel="shortcut icon" href="http://www.amuker.com/favicon.ico">
Rel：定义的是该文档与被链接文档之间是什么关系“这里是外部css样式表，即stylesheet。”
type：规定外部链接文档是什么打开类型，link中的css 这样写法“type=”text/css”。”link中的网站小图标写法“ type=”image/x-icon” 。”
href：是外部css地址。
3. script标签
用在头部head标签内，作用是调用外部js文件。该标签是一个封闭标签，写法和div标签一样。另外，该标签不仅仅可以在头部head标签内使用，在body标签内部任何位置都可以使用。最终实现的效果都是一样的，通常是用在head标签内。
例如：<script src="http://www.amuker.com/include/lib/js/common_tpl.js" type="text/javascript"></script>
Src中是调用js文件地址。Type规定调用js文件的打开方式。
4. meta标签
Meta标签的作用通常是用作网页关键词、网页描述、作者、网页编码、robots、自动跳转等说明性标签。这样写法随处可见，任何一个网页中都有meta标签的使用。
4.1 网页显示字符集网页编码
中文：<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
繁体中文：<meta http-equiv="Content-Type" content="text/html; charset=BIG5" />
英 语：<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
4.2 网页制作者信息
<meta name="author" content="amuker" />
4.3网页关键字
<meta name="keywords" content="慕轲博客,慕轲的博客,个人博客,慕轲SEO,智力题,网站建设,优化技巧,慕轲自媒体" />
4.4 网页描述
<meta name="description" content="本博客主要关注IT互联网领域并分享相关的下载资源,搜索引擎优化(SEO)知识,建站心得等方面的经验心得。" />
4.5 防止别人在框架里调用你的页面<meta http-equiv="Window-target" content="_top" />
4.6 自动跳转（此标签用法可以让网页在多少秒后自动从当前页面跳转到另外一个网页页面或网站）
<meta http-equiv="Refresh" content="5;URL=http://www.amuker.com" />
Content后跟值为当前页面在多少时间跳转
Url值为跳转到具体网页网站
4.7. 网页告诉搜索机器人向导对此网页操作（用来告诉搜索机器人哪些页面需要索引，哪些页面不需要索引）
<meta name="robots" content="all" />
content的参数有all,none,index,noindex,follow,nofollow。默认是all。如果在一个页面不加入此标签默认情况下content="all"意思是搜索并收录抓取爬行此网页及此网页指向页面。
None：搜索引擎将忽略此网页，等价于noindex，nofollow。
Noindex：搜索引擎不索引此网页。
Nofollow：搜索引擎不继续通过此网页的链接索引搜索其它的网页。
All：搜索引擎将索引此网页与继续通过此网页的链接索引，等价于index，follow。
Index：搜索引擎索引此网页。
Follow：搜索引擎继续通过此网页的链接索引搜索其它的网页。
5. style标签
常见Style标签作为放置CSS样式与放置javascript（js）代码标签。
首先<style></style>是一对有开始与结束的闭合标签。
5.1 放置CSS样式
<style type="text/css">…</style>中间用于放CSS样式代码。
在HTML中CSS代码只有放置在其<style type="text/css">标签内才能生效。
5.2 放置JS代码
<style type="text/javascript">…</style>
在HTML中JS代码一般放入<style type="text/javascript">标签内。
上面5类标签的使用，是head标签中最为常用也是必须要有的标签。特此，针对头部标签用法做这次的笔记整理，以分享给大家。订阅百家号 三龙鑫，阅读web前端开发技术。
---
转载请注明本文标题和链接：《炼狱解读HTML头部head中的5个HTML标签用法》