首页 > 代码库 > Html之head部分详解
Html之head部分详解
随便打开一个网页，右击查看网页源代码，总能看到<head>…</head>封闭标签，在里面通常会包含5类标签：title、link、script、meta、style。这5类标签看着都挺熟悉的哈，那么在web前端技术中具体要怎么使用，规则是什么，在我学习的时侯，我做了笔记整理，希望有帮助。
1. title 标签
title是一个封闭标签，在head中是成对出现。也就是<title>…</title>。在打开一个网页时，网页上方的文字就是title部分。
Title是对整个页面的核心思想的总结，也是seo非常重要的设置部分。Title部分尽量要多次出现关键词：核心关键词和长尾关键词。具体怎么写title部分，根据需求而定。这个没有标准。
2. link 标签
Link标签放置在<head>…</head>中，作用是链接外部css文件和收藏夹图标。最常用的用法是链接外部样式表，也就是css文件。link写法是“<link … />”
例如：
引入外部css样式：<link rel=”stylesheet” type=”text/css” href=http://www.mamicode.com/”http://www....... /style.css” />
设置网站小图标（收藏图标）：<link rel=”shortcut icon” type=”image/x-icon” href="http://....../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.mamicode.com/”http://www...../index.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="Evance" />
4.3网页关键字
<meta name="keywords" content="Michael，Blog" />
4.4 网页描述
<meta name="description" content="Michael，Blog" />
4.5 防止别人在框架里调用你的页面<meta http-equiv="Window-target" content="_top" />
4.6 自动跳转（此标签用法可以让网页在多少秒后自动从当前页面跳转到另外一个网页页面或网站）<meta http-equiv="Refresh" content="5;URL=http://www.域名.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">标签内。
Html之head部分详解