在 HTML 语言的头元素中,一般包含标题、元信息(关键词、描述等)、基底信息、脚本(scripts)和样式文件(CSS)等。HTML 头元素是以<head>为开始标签,以</head>为结束标签。通常情况下,Css 和 JavaScript 都定义在头元素中。

提示:HTML 头部元素内定义的内容不会再网页上显示的。它用于包含当前 HTML 文件的相关信息。

HTML 常用 head 元素

标 签描 述
<title>定义显示在浏览器上方的标题内容
<base>定义当前文档的URL全称(基底网址)
<meta>定义文档的元信息,如关键词、描述等
<style>定义CSS层叠样式表的内容
<link>定义文档的外部文件的链接
<script>定义页面客户端程序脚本的内容或文件

提示:以上元素不会在浏览器的主窗口中显示,但是它们有着重要的意义。

HTML <title>标题元素

  • 标题文字位于<title></title>标签间。
  • <title>...</title>元素位于 HTML 文档的头部,即<head>元素中。
  • HTML 文件的标题显示在浏览器的标题栏中,用于描述文件的用途。
  • 当用户将网页添加到收藏夹时,标题会显示在收藏夹中。
  • 用于显示在网站列表页或搜索引擎结果页面的标题。

HTML <title> 语法格式

<title>标题内容</title>

HTML <title> 实例代码

<!DOCTYPE html>
<html>
<head>
<title>网页标题</title>
</head>
<body>
    网页正文
</body>
</html>

提示:<title> 元素在 HTML/XHTML 文档中是必须的。

HTML <meta> 元素

  • <meta> 元素提供的信息是不可见的,不显示在页面中。
  • <meta> 是空元素,不需要设置结束标签。
  • 在一个 HTML 文件中可以有多个 meta 元素

设置 HTML 页面关键词

设置页面关键词是为了向搜索引擎说明该网页的关键词,从而帮助搜索引擎对该网页进行查找,从而提高被搜索到的几率。

语法格式

<meta name="keywords" content="关键词1,关键词2">

提示:多个关键词之间用逗号隔开,建议设置的关键词不要太多,很多搜索引擎会限制关键词数。

设置 HTML 页面描述

设置页面描述是为了便于搜索引擎查找的,它可用来表述网页的主要内容。

语法格式

<meta name="description" content="网页的描述内容">

设置 HTML 页面编码和语言

<!-- 方法一 -->
<meta http-equiv="Content-Type" content="text/html;charset=字符集类型">
<!-- 方法二 -->
<meta http-equiv="Content-Language" content="zh_CN">

提示:在charset中设置网页的内码语系(字符集的类型)。charset有utf-8、gb2312(简体中文)和ISO-8859-1等字符集。

HTML <base> 基底元素

  • 基底网址能够把当前 HTML 页面中使用相对URL路径转换成绝对URL路径。
  • HTML 页面中应该只定义一个基底网址元素。
  • 基底网址元素应放置在头部以及任何包含 URL 地址的语句之前。

语法格式

<base href="链接地址" target="新窗口的打开方式">

target常用属性值如下:

属性值描 述
_top在浏览器的整个窗口中打开,无视任何框架
_parent在上一级窗口中打开
_blank在新窗口中打开
_self在同一窗口中打开,可以省略

提示:在 HTML 中,URL路径分为两种形式:绝对路径相对路径。绝对路径是完整的磁盘上的目录路径。相对路径是相对于当前 HMTL 文档所在目录或站点根目录的路径。另外,“../”来表示上一级目录,“../../”表示上上级的目录,以此类推。

HTML <style> 元素

在<style> 元素中添加样式来渲染 HTML 文档:

<style type="text/css">
body {color:#404040;background-color:#fff;}
a {color: #008000;text-decoration:none;}
</style>

HTML <link> 元素

<link> 标签定义了文档的外部文件的链接,通常用于链接到样式表

语法格式

<!-- 引用Css样式表 -->
<link rel="stylesheet" type="text/css" href="index.css">

HTML <script> 元素

<script> 元素在令网站变得跟动态、更富特色方面起着关键作用。可以用它为 HTML 文档加入脚本,以便响应用户的动作。/p>

<!-- 引用javascript -->
<script type="text/javascript" src="index.js">

注意:type是必需属性,说明所包含的脚本的MIME类型。使用 JavaScript 是必需设置为 text/javascript。可选属性charset说明脚本使用的字符编码。src:一个指向包含脚本文档的URL