HTML head 元素
head
元素是所有头元素的容器,提供有关页面的额外信息,或引用页面显示或行为正常所需的其他资源。
HTML head 元素
head
元素共同描述文档的属性,例如标题,提供元信息,指示浏览器在何处查找样式表,以及指向或包括允许以高度活跃和交互方式扩展 HTML 文档的脚本。
可以在 <head>
内部使用的 HTML 元素元素是: <title>
,<base>
,<link>
, <style>
,<meta>
,<script>
和 <noscript>
。
HTML 标题元素
<title>
元素定义了文档的标题。
所有 HTML / XHTML 文档中都需要 title
元素来生成有效文档。文档中只允许使用一个标题元素,并且必须将其放在 head
元素中。 title
元素包含纯文本和实体; 它不能包含其他标记。
该文件的标题可用于不同目的。例如:
- 在浏览器标题栏和任务栏中显示标题。
- 在将页面添加到收藏夹或添加书签时为页面提供标题。
- 在搜索引擎结果中显示页面的标题。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Hello World Document</title>
</head>
<body>
<p>Hello World!</p>
</body>
</html>
提示: 好的标题应该简短并且跟文档的内容相关,因为搜索引擎的网络抓取工具会特别注意标题中使用的单词。理想情况下,标题的长度应小于 65 个字符。了解更多。
HTML 基本元素
HTML <base>
元素用于为文档中包含的所有相对链接定义基本 URL,例如,你可以在页面顶部设置一次基本 URL,然后所有后续相对链接将使用该 URL 作为起点。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Defining a base URL</title>
<base href="https://www.tutorialrepublic.com/">
</head>
<body>
<p><a href="html-tutorial/html-head.html">HTML Head</a>.</p>
</body>
</html>
无论当前页面的 URL 是什么,上面的链接实际上都会解析到 http://www.tastones.com/html-tutorial/html-head.html
。这是因为 HTML 教程链接中指示的相对 URL: html-tutorial/html-head.html
添加到基本 URL 的末尾: http://www.tastones.com/
。
警告: HTML <base>
元素必须出现在引用外部资源的任何元素之前。HTML 仅允许每个文档使用一个基本元素。
HTML 链接元素
<link>
元素定义当前文档与外部文档或资源之间的关系。 link
元素的一个常见用途是链接到外部样式表。
<head>
<title>Linking to style sheets</title>
<link type="text/css" rel="stylesheet" href="style.css">
</head>
要了解有关链接样式表的更多信息,请查看有关 HTML 样式的教程。
注意: 文档的 <head>
元素可以包含任意数量的 <link>
元素。<link>
元素具有属性,但没有内容。
HTML 样式元素
<style>
元素用于定义 HTML 文档的嵌入样式信息。 <style>
元素内的样式规则指定 HTML 元素在浏览器中的呈现方式。
<head>
<title>Internal style sheet</title>
<style type="text/css">
body { background-color: YellowGreen; }
h1 { color: red; }
p { color: green; }
</style>
</head>
注意: 当单个文档具有唯一样式时,应使用嵌入式样式表。如果在多个文档中使用相同的样式表,则外部样式表更合适。了解更多。
HTML meta
元素
<meta>
元素提供有关 HTML 文档的元数据。元数据是一组描述和提供有关其他数据的信息的数据。
元元素将在下一章中介绍。
HTML 脚本元素
<script>
元素用于定义客户端脚本,例如JavaScript。
脚本和 noscript
元素将在后面的章节中介绍。