随便打开一个网页，右击查看网页源代码，总能看到<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....... /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...../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部分详解的更多相关文章

  1. Linq之旅：Linq入门详解（Linq to Objects）

    示例代码下载:Linq之旅:Linq入门详解(Linq to Objects) 本博文详细介绍 .NET 3.5 中引入的重要功能:Language Integrated Query(LINQ,语言集 ...

  2. 架构设计：远程调用服务架构设计及zookeeper技术详解（下篇）

    一.下篇开头的废话 终于开写下篇了,这也是我写远程调用框架的第三篇文章,前两篇都被博客园作为[编辑推荐]的文章,很兴奋哦,嘿嘿~~~~,本人是个很臭美的人,一定得要截图为证: 今天是2014年的第一天 ...

  3. EntityFramework Core 1.1 Add、Attach、Update、Remove方法如何高效使用详解

    前言 我比较喜欢安静,大概和我喜欢研究和琢磨技术原因相关吧,刚好到了元旦节,这几天可以好好学习下EF Core,同时在项目当中用到EF Core,借此机会给予比较深入的理解,这里我们只讲解和EF 6. ...

  4. Java 字符串格式化详解

    Java 字符串格式化详解 版权声明:本文为博主原创文章,未经博主允许不得转载. 微博:厉圣杰 文中如有纰漏,欢迎大家留言指出. 在 Java 的 String 类中,可以使用 format() 方法 ...

  5. Android Notification 详解（一）——基本操作

    Android Notification 详解(一)--基本操作 版权声明:本文为博主原创文章,未经博主允许不得转载. 微博:厉圣杰 源码:AndroidDemo/Notification 文中如有纰 ...

  6. Android Notification 详解——基本操作

    Android Notification 详解 版权声明:本文为博主原创文章,未经博主允许不得转载. 前几天项目中有用到 Android 通知相关的内容,索性把 Android Notificatio ...

  7. Git初探--笔记整理和Git命令详解

    几个重要的概念 首先先明确几个概念: WorkPlace : 工作区 Index: 暂存区 Repository: 本地仓库/版本库 Remote: 远程仓库 当在Remote(如Github)上面c ...

  8. Drawable实战解析：Android XML shape 标签使用详解（apk瘦身，减少内存好帮手）

    Android XML shape 标签使用详解   一个android开发者肯定懂得使用 xml 定义一个 Drawable,比如定义一个 rect 或者 circle 作为一个 View 的背景. ...

  9. Node.js npm 详解

    一.npm简介 安装npm请阅读我之前的文章Hello Node中npm安装那一部分,不过只介绍了linux平台,如果是其它平台,有前辈写了更加详细的介绍. npm的全称:Node Package M ...

  10. .NET应用和AEAI CAS集成详解

    1 概述 数通畅联某综合SOA集成项目的统一身份认证工作,需要第三方系统配合进行单点登录的配置改造,在项目中有需要进行单点登录配置的.NET应用系统,本文专门记录.NET应用和AEAI CAS的集成过 ...

随机推荐

  1. php怎么获取mac地址？

    如何用php获取mac地址呢?大家知道mac地址是电脑在全球范围的唯一标识,所以这个就非常实用,比如说要做一个投票功能,那mac地址是必不可少 的,如果单纯的靠ip地址来判断这个肯定是不准确的,水分太 ...

  2. python基础教程1

    python作为一种编程语言,诞生于1990年左右,算是一门比较年轻的语言(也算是90后吧),它是面向对象的,但不同于JAVA\C#那么严格要求一切皆对象,更接近于C++,是面向过程和面向对象的结合: ...

  3. SqlServer 还原他服数据库只建立发布却删除不了

    本想做测试,从另一台服务器备份数据库还原到本机. 创建了一个发布,却删除不了,提示如下图: 参考论坛:http://bbs.csdn.net/topics/300046417 发现是数据库所有者问题, ...

  4. C# DateTime和String转换

    "; DateTime.ParseExact(time,"yyyyMMdd",System.Globalization.DateTimeFormatInfo.Curren ...

  5. 使用type="redirect"重定向，传递List等变量到jsp页面的问题

    Struts2在提交表单的时候,使用「type="redirect"」重定向到相应的jsp页面. Action中的List表单是无法传到相应的jsp页面. 我猜测是因为List作为 ...

  6. Asp.net 网站防攻击安全设置

    针对已解密的_ViewStat参数漏洞整改建议:在<system.web>下添加 <machineKey validation="3DES"/> 禁用脚本调 ...

  7. CCActionManager

    当CCnode执行runAction的时候,runAction会调用动作管理类的addAction方法将它自己执行的动作传递给动作管理类,动作管理类再将动作添加到自己的动作序列中. 动过管理类通过定时 ...

  8. linux kernel 平台总线实例分析

    linux 平台总线的实现有三大块  , platform bus , platform device , platform drvice 平台类型结构体: /** * struct bus_type ...

  9. COGS 2421.[HZOI 2016]简单的Treap 题解

    题目大意: 给定n个数及其优先级,求对应的符合最小堆性质的Treap的先序遍历. n<=500000. 解法: 目前为止我只想到了三种解法,其中第三种是正解. 1.暴力1 以优先级为关键字排序, ...

  10. dtw算法优化(重写C语言版本)

    1.缩小搜索范围 2.降低内存消耗