HTML Head

HTML <head> 标签

<head> 标签是元数据的容器(定义数据的数据),位于 <html> 标签和 <body>标签之间。

HTML元数据是有关HTML文档的数据。元数据是不显示的。

元数据通常定义文档标题,字符集,样式,链接,脚本和其他元信息。

以下标记描述元数据: <title><style><meta><link><script><base>


HTML <title> 标签

<title>标签定义文档的标题,并且在所有HTML / XHTML文档中都是必需的。

<title>标签:

  • 在浏览器选项卡中定义标题
  • 在将页面添加到收藏夹时为页面提供标题
  • 在搜索引擎结果中显示该页面的标题

一个简单的HTML文档:

实例

<!DOCTYPE html>
<html>

<head>
  <title>新手教程(www.uihtml.com)</title>
</head>

<body>
提供了编程的基础技术教程......
</body>

</html>

HTML <style> 标签

<style>标签用于定义单个HTML页面的样式信息:

实例

<style>
  body {background-color: powderblue;}
  h1 {color: red;}
  p {color: blue;}
</style>


HTML <link> 标签

<link>标签用于链接到外部样式表:

实例

<link rel="stylesheet" href="mystyle.css">

提示:要了解有关CSS的所有信息,请访问我们的CSS教程


HTML <meta> 标签

<meta>标签用于指定使用的字符集,页面描述,关键字,作者和其他元数据。

浏览器(如何显示内容),搜索引擎(关键字)和其他Web服务使用元数据。

定义使用的字符集:

<meta charset="UTF-8">

定义您的网页的描述:

<meta name="description" content="新手教程(www.uihtml.com)">

为搜索引擎定义关键字:

<meta name="keywords" content="HTML, CSS, XML, JavaScript">

定义页面的作者:

<meta name="author" content="Bobby">

每30秒刷新一次文档:

<meta http-equiv="refresh" content="30">

<meta>标签的示例:

实例

<meta charset="UTF-8">
<meta name="description" content="新手教程(www.uihtml.com)">
<meta name="keywords" content="HTML,CSS,XML,JavaScript">
<meta name="author" content="Bobby">

设置视口

HTML5引入了一种方法,让网页设计师通过<meta>标签控制视口。

视口是用户在网页上的可见区域。它随设备而变化,在手机上比在电脑屏幕上小。

您应该在所有网页中包含以下<meta> viewport元素:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<meta> viewport元素为浏览器提供有关如何控制页面尺寸和缩放的说明。

width = device-width部分将页面宽度设置为遵循设备的屏幕宽度(具体取决于设备)。

initial-scale = 1.0部分设置浏览器首次加载页面时的初始缩放级别。


HTML <script> 标签

<script>标记用于定义客户端脚本(JavaScript)。

这个JavaScript写的是"Hello JavaScript!"到id ="demo"的HTML元素:

实例

<script>
function myFunction {
    document.getElementById("demo").innerHTML = "Hello JavaScript!";
}
</script>

提示:要了解有关JavaScript的所有信息,请访问我们的JavaScript教程


HTML <base> 标签

<base>标签为页面上的所有链接规定默认地址或默认目标:

实例

<base href="https://www.uihtml.com/images/" target="_blank">

省略<html>,<head>和<body>?

根据HTML5标准;可以省略<html><body><head>标记。

以下代码将验证为HTML5:

实例

<!DOCTYPE html>
<title>新手教程(www.uihtml.com)</title>

<h1>这是标题</h1>
<p>这是段落.</p>

注意:

uihtml不建议省略<html><body>标签。省略这些标记可能会导致DOM或XML软件崩溃并在旧版浏览器中产生错误(IE9)。

但是,省略<head>标签已经很常见了很长一段时间。


HTML Head 标签

标签 描述
<head> 标签是元数据的容器(定义数据的数据)
<title> 标签定义文档的标题,并且在所有HTML / XHTML文档中都是必需的
<base> 标签为页面上的所有链接规定默认地址或默认目标
<link> 标签用于链接到外部样式表
<meta> 标签用于指定使用的字符集,页面描述,关键字,作者和其他元数据
<script> 标记用于定义客户端脚本
<style> 标签用于定义单个HTML页面的样式信息