HTML 标题、注释、水平线

最新推荐文章于 2024-04-24 09:27:42 发布

文丑颜不良啊

最新推荐文章于 2024-04-24 09:27:42 发布

阅读量1.3k

点赞数

分类专栏： HTML 与 CSS 文章标签： html 前端 html 标题 html 注释 html 水平线

本文链接：https://blog.csdn.net/jiaomubai/article/details/126834910

版权

HTML 与 CSS 专栏收录该内容

22 篇文章 2 订阅

订阅专栏

标题

HTML 中标题(heading)就如同我们写文章时的一级标题和二级标题一样，可以用来区分文章的层次。HTML 的标题是通过 <h1>-<h6> 的标签来实现的，可以理解为 <h1> 就代表以及标题，<h2> 就代表二级标题......<h1> 定义最大的标题，<h6> 定义最小的标题。浏览器会自动地在标题的前后加上空行。

使用标题时需要注意的是确保将 HTML 标题的标签只用于标题，不要为了生成粗体或大号的文本而使用标题。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>HTML 标题示例</title>
</head>
<body>
    <h1>这是一级标题</h1>
    <h2>这是二级标题</h2>
    <h3>这是三级标题</h3>
    <h4>这是四级标题</h4>
    <h5>这是五级标题</h5>
    <h6>这是六级标题</h6>
</body>
</html>

标题大小与字体大小的关系：一级标题对应6号字体，二级标题对应5号字体......即标题大小与字体大小逆序对应。如果设置字体大小为6号且加粗，那么展示效果就如同一级标题一样：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>HTML 标题示例</title>
</head>
<body>
    <h1>这是一级标题</h1>
    <font size="6"><b>这是6号字体</b></font>
    <h2>这是二级标题</h2>
    <font size="5">这是5号字体</font>
    <h3>这是三级标题</h3>
    <font size="4">这是4号字体</font>
    <h4>这是四级标题</h4>
    <font size="3">这是3号字体</font>
    <h5>这是五级标题</h5>
    <font size="2">这是2号字体</font>
    <h6>这是六级标题</h6>
    <font size="1">这是1号字体</font>
</body>
</html>

注释

可以将注释插入到 HTML 代码中，这样可以提高代码的可读性，使代码更易被人理解。浏览器会忽略注释，也不会显示注释。

<!--  -->

注释的写法如上所示：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>HTML 注释示例</title>
</head>
<body>
    <!-- 这是一行注释 -->
    <p>这是一行<b>注释</b></p>
</body>
</html>

水平线

<hr> 标签用于在 HTML 页面中创建水平线。hr 元素可用于分隔内容。

示例：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>HTML 水平线示例</title>
</head>
<body>
    水平线
    <hr />
    <hr />
    <hr />

</body>
</html>