您的位置：首页 > Web前端 > HTML

HTML笔记——头部<head>

2014-04-14 21:50 176 查看

头元素内的信息

头元素内的元素不会被浏览器显示出来。

假如你将 <h1> 或者 <p> 之类的 HTML 元素像这样置于头元素之中，大多数浏览器都会显示它，即使这是非法的。

根据 HTML 标准，仅有几个标签在 HTML 的头部分是合法的。它们是：<base>, <link>, <meta>, <title>, <style> 和 <script>。

标签描述
<head>定义关于文档的信息。
<title>定义文档标题。
<base>定义页面中所有链接的基准 URL。
<link>定义资源引用。
<meta>定义元信息。
标签描述
<!DOCTYPE>定义文档类型。此标签须位于 html 标签之前。

<meta>

必须包含的属性：

content

content 属性提供了 名称/值 对中的值。该值可以是任何有效的字符串。

content 属性始终要和 name 属性或 http-equiv 属性一起使用。

可选的属性：

http-equiv

http-equiv 属性为名称/值对提供了名称。并指示服务器在发送实际的文档之前先在要传送给浏览器的 MIME 文档头部包含名称/值对。

当服务器向浏览器发送文档时，会先发送许多名称/值对。虽然有些服务器会发送许多这种名称/值对，但是所有服务器都至少要发送一个：content-type:text/html（默认就发送）。这将告诉浏览器准备接受一个 HTML 文档。

常用取值还有refresh ，用于网页重定向，例如：

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<meta http-equiv="refresh" content="3;url=htmlDemo.html" />

<title>重定向</title>

</head>

<body>

网页已被重定向，3秒后跳转到 htmlDemo.html

</body>

</html>

W3C 声明说：

某些用户程序支持使用 META 在设定好的几秒钟后来刷新当前的页面，并将之替换为另一个 url。

开发人员不应使用此技术强迫用户转到不同的页面，因为这样会使页面的可用性变差。

相反，应使用服务器端重定向来进行自动页面定向。(即 在servlet里面用request.getRequestDispatcher(url).forward(request,response))

使用带有 http-equiv 属性的 <meta> 标签时，服务器将把名称/值对添加到发送给浏览器的内容头部。例如，添加：

<meta [code]http-equiv="charset"
content="iso-8859-1">
<meta 
http-equiv="expires"
content="31 Dec 2008"> ——这句用于设定网页的到期时间，过期则必须到服务器上重新调用，
若content="-1"则表示网页在任何时候都不能被Cache存储。[/code]
这样发送到浏览器的头部就应该包含：

content-type: text/html
charset:iso-8859-1
expires:31 Dec 2007

当然，只有浏览器可以接受这些附加的头部字段，并能以适当的方式使用它们时，这些字段才有意义。

name

name 属性提供了名称/值对中的名称。

HTML 和 XHTML 标签都没有指定任何预先定义的 <meta> 名称。通常情况下，您可以自由使用对自己和源文档的读者来说富有意义的名称。

"keywords" 是一个经常被用到的名称。它为文档定义了一组关键字。某些搜索引擎在遇到这些关键字时，会用这些关键字对文档进行分类。

类似这样的 meta 标签可能对于进入搜索引擎的索引有帮助：

<meta [code]name="keywords"
content="HTML,ASP,PHP,SQL"[/code]
如果没有提供 name 属性，那么名称/值对中的名称会采用 http-equiv 属性的值。

针对搜索引擎的关键字

某些万维网搜索引擎使用 meta 标签的 name 和 content 属性来索引页面。

这个 Meta 元素定义了对页面的描述:

<meta [code]name="description"

content="Free Web tutorials on HTML, CSS, XML, and XHTML" />[/code]
这个 Meta 元素定义了页面的关键字:

<meta [code]name="keywords"

content="HTML, DHTML, CSS, XML, XHTML, JavaScript, VBScript">[/code]
name 和 content 属性的作用是描述页面的内容。

然而，由于非常多的人们使用 meta 标签制造垃圾信息，比方说在页面重复关键词以达到提高排名的目的，一些搜索引擎已经彻底放弃了使用它们。

<link>

语法：

<link rel="stylesheet" type="text/css" href="style.css" >

属性

new : HTML5 中的新属性。
属性值描述
charsetchar_encodingHTML5 中不支持。
hrefURL规定被链接文档的位置。
hreflanglanguage_code规定被链接文档中文本的语言。
mediamedia_query规定被链接文档将被显示在什么设备上。
relalternate
author
help
icon
licence
next
pingback
prefetch
prev
search
sidebar
stylesheet
tag

规定当前文档与被链接文档之间的关系。
revreversed relationshipHTML5 中不支持。
sizesheightxwidth
any

规定被链接资源的尺寸。仅适用于 rel="icon"。
target_blank
_self
_top
_parent
frame_name

HTML5 中不支持。
typeMIME_type规定被链接文档的 MIME 类型。

rel 属性


定义和用法

rel 属性规定当前文档与被链接文档之间的关系。


浏览器支持

只有 rel 属性的 "stylesheet" 值得到了所有浏览器的支持。其他值只得到了部分地支持。

属性值

值描述
alternate文档的替代版本（比如打印页、翻译或镜像）。
stylesheet文档的外部样式表。
start集合中的第一个文档。
next集合中的下一个文档。
prev集合中的上一个文档。
contents文档的目录。
index文档的索引。
glossary在文档中使用的词汇的术语表（解释）。
copyright包含版权信息的文档。
chapter文档的章。
section文档的节。
subsection文档的小节。
appendix文档的附录。
help帮助文档。
bookmark相关文档。
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航