肉渣教程

HTML 标题

上一节 下一节

HTML 标题

HTML 标题( Heading )是由 <h1>标签到<h6>标签来定义出来的。
<h1>则意味这是最重要的标题;<h2>次之;以此类推,<h6>则重要性最弱。

<h1>这是H1标题</h1>
<h2>这是H2标题</h2>
<h3>这是H3标题</h3>
<h4>这是H4标题</h4>
<h5>这是H5标题</h5>
<h6>这是H6标题</h6>

运行一下

标题的重要性

标题的加粗、字号、前后间距等特性都可以通过不同样式的<p>来实现;但是一般都不会采取这种替代方案。因为标题本身有其重要的意义。

标题体现的不仅仅是内容,更是HTML文档的结构与重点。有助于搜索引擎对网页内容的理解。

标题的样式

每一类HTML标题都有其默认的字体大小、字体颜色等样式,但实际开发中更多的是通过CSS样式表的方式来定义出符合需求的标题元素。

<h1 style="font-size:30px;color:#46acb6;">H1标题</h1>

运行一下

HTML 水平线

<hr>标签在HTML页面中会显示成一条分隔内容的水平线。

<h1>H1标题</h1>
<p>这是一个段落</p>
<hr>
<h2>H2标题</h2>
<p>这是另一个段落</p>
<hr>
<p>这是又一个段落</p>

运行一下

HTML 注释

在HTML代码中插入注释有助于提高代码的可读性,对开发有益。插入注释的方法如下所示,备注是不会被浏览器显示出来的,即被浏览器忽略。

<!-- 注释内容写在这里即可 -->
<p>这是一个段落</p>

运行一下

HTML <head>元素

HTML <head>元素与HTML 标题(Heading)没有任何关系。

<head>元素放在<html>元素内,<body>元素前;<head>元素的内容并不会被浏览器显示出来,<head>元素内就是包含了文档的各种附加信息,比如在<head>元素内定义文档的编码模式、引用样式脚本、引用JavaScript脚本等等。

<!DOCTYPE html>
<html>

<head>
  <title>示例</title>
  <meta charset="UTF-8">
</head>

<body>
  <p>head元素的内容不会被显示出来。</p>
</body>

</html>

运行一下


如何查看网页源代码

用浏览器查看网页的源代码是一件简单的事情,各浏览器大同小异,以苹果操作系统Mac OS下的Chrome浏览器为例。

查看网页源代码:用Chrome打开网页 > 视图 > 开发者 > 显示网页源代码

检查某个HTML元素:在网页上停在要查看的网页元素处,右键单击,选择“检查”即可。


HTML 标题

上一节 下一节