当前位置:首页>HTML>HTML教程>HTML标题

HTML标题

作者:微学网发布时间:2019-08-08 22:07:09

标题在HTML文档中很重要。

什么是标题

标题是对一段文字内容的概括总结

书籍文本少不了标题,网页文本也不能没有标题。

一篇文档的好坏,标题起到重要的作用。

在越来越追求“视觉美感”的今天,一个好标题的设计对用户的留存尤为关键。

同样的标题内容,使用了不同的页面标签,显示的效果则大相径庭

html标题标签

标题使用<h1><h6>标记定义。

标题标签共有6个,分别是<h1><h2><h3><h4><h5><h6>,每个标签在字体大小上都有明显的区别,从<h1>标签到<h6>标签字体依次变小。

<h1>标签表示最大的标题,<h6>标签表示最小的标题。一般使用<h1>标签来表示网页中最上层的标题,而且有些浏览器会默认把<h1>标签显示为非常大的字体,所以一些开发者会使用<h2>标签代替<h1>标签来显示最上层的标题。

<h1>这是一个标题。</h1>
<h2>这是一个标题。</h2>
<h3>这是一个标题。</h3>
<h4>这是一个标题。</h4>
<h5>这是一个标题。</h5>
<h6>这是一个标题。</h6>

试一试

注意:浏览器会在每个标题之前和之后自动添加一些空白区域(边距)。

HTML标题标签的 常见错误

如果结束标签漏加“/”,比如把</h1>写成<h1>,则会导致浏览器认为是标题标签的开始,从而导致页面布局错乱。

HTML水平线

<hr>标记在HTML页面中创建一条水平线。

<hr>元素可用于分隔内容。

<p>这是一个段落。</p>
<hr>
<p>这是一个段落。</p>
<hr>
<p>这是一个段落。</p>

试一试

HTML 注释

注释可以插入到HTML代码中,以提高可读性并使代码更易于理解。浏览器忽略注释,不显示它们。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>微学网(weixue.wang)</title>
</head>
<body>

<!--这是一个注释,注释在浏览器中不会显示-->
<p>这是一个段落</p>

</body>
</html>

试一试

注:第一个括号(左括号)后需加感叹号,括号(右括号)前无需加括号,合理使用注释有助于今后编码工作。

如何查看HTML源代码

你有没有看过一个网页,并想知道“嘿!他们是怎么做到的?”

要查找,请在页面中单击鼠标右键,然后在其他浏览器中选择“查看源代码”(在Chrome中)或“查看源”(在IE中)或类似内容。这将打开一个包含页面HTML代码的窗口。

HTML head元素

HTML <head>元素与HTML标题无关。

HTML <head>元素包含元数据。不显示元数据。

HTML <head>元素放在<html>标记和<body>标记之间。

<!DOCTYPE html>
<html>

<head>
  <title>My First HTML</title>
  <meta charset="UTF-8">
</head>

<body>

HTML title元素

HTML <title>元素是元数据。它定义了HTML文档的标题。

标题不会显示在文档中,会显示在浏览器选项卡中。