HTML注释与段落、换行标签详解
一、HTML注释（Comment）
1. 什么是HTML注释？
在 HTML 中，注释（Comment）是用于给开发者添加说明文字的内容，浏览器不会把注释内容显示在网页中。
HTML注释主要用于：
解释代码功能
标记代码区域
方便后期维护
暂时隐藏某部分HTML代码
HTML注释格式：
<!-- 这里是注释内容 -->例如：
<!DOCTYPE html> <html> <head> <title>HTML学习</title> </head> <body> <!-- 这是网页的标题区域 --> <h1>我的HTML学习博客</h1> <!-- 这是文章内容区域 --> <p>今天学习HTML基础标签</p> </body> </html>浏览器显示：
我的HTML学习博客 今天学习HTML基础标签但是：
<!-- 这是网页的标题区域 -->不会显示出来。
二、HTML注释的作用
1. 提高代码可读性
例如：
没有注释：
<div> <h1>我的博客</h1> <p>学习HTML基础知识</p> </div>别人可能不知道这个div作用。
添加注释：
<!-- 博客首页内容 --> <div> <h1>我的博客</h1> <p>学习HTML基础知识</p> </div>代码结构更加清晰。
2. 暂时屏蔽代码
开发过程中，有时候不想删除代码，可以使用注释。
原代码：
<h1>Hello HTML</h1> <p>学习前端开发</p>暂时隐藏：
<!-- <h1>Hello HTML</h1> <p>学习前端开发</p> -->浏览器不会显示：
Hello HTML 学习前端开发三、HTML注释注意事项
1. 注释不能嵌套
错误：
<!-- 外层注释 <!-- 内层注释 --> -->HTML不支持注释里面再写注释。
2. 注释符号必须完整
正确：
<!-- 注释内容 -->错误：
<!-- 注释内容缺少结束符：
-->可能导致页面解析异常。
四、HTML段落标签<p>
1. 什么是段落标签？
<p>是 HTML 中表示**段落（paragraph）**的标签。
语法：
<p>段落内容</p>例如：
<p> HTML是一门用于创建网页结构的语言。 </p> <p> CSS负责网页样式设计。 </p>浏览器显示：
HTML是一门用于创建网页结构的语言。 CSS负责网页样式设计。可以看到：
两个<p>标签之间自动产生了一定间距。
五、为什么使用<p>标签？
很多初学者喜欢这样写：
HTML是一门语言 CSS负责样式 JavaScript负责交互但是HTML无法正确识别这些文字之间的关系。
正确方式：
<p>HTML是一门语言</p> <p>CSS负责样式</p> <p>JavaScript负责交互</p>这样浏览器知道：
第一段文字是一段内容
第二段文字是另一段内容
第三段文字是另一段内容
六、HTML换行标签<br>
1. 什么是换行标签？
<br>表示换行（break）。
作用：
让后面的内容换到下一行。
语法：
<br>例如：
<p> 我是第一行<br> 我是第二行<br> 我是第三行 </p>显示：
我是第一行 我是第二行 我是第三行七、<p>和<br>的区别
1.<p>创建新的段落
例如：
<p>第一段内容</p> <p>第二段内容</p>效果：
第一段内容 第二段内容两个段落之间有默认间距。
2.<br>只是换行
例如：
第一行<br> 第二行效果：
第一行 第二行不会产生段落间距。
八、什么时候使用<p>，什么时候使用<br>？
使用<p>：
适合：
文章内容
新闻
博客正文
长文本
例如：
<p> 今天学习HTML基础知识。 </p> <p> HTML是前端开发的重要基础。 </p>使用<br>：
适合：
地址换行
诗歌
联系方式
例如：
<p> 中国<br> 湖北省<br> 武汉市 </p>显示：
中国 湖北省 武汉市九、综合案例
创建一个简单HTML博客：
<!DOCTYPE html> <html> <head> <title>HTML学习博客</title> </head> <body> <!-- 网站标题 --> <h1>我的HTML学习笔记</h1> <!-- 第一篇文章 --> <p> HTML是超文本标记语言， 用于创建网页结构。 </p> <p> 学习HTML需要掌握各种标签， 例如标题、段落、图片、链接等。 </p> <!-- 地址信息 --> <p> 作者：小明<br> 时间：2026年7月29日 </p> </body> </html>页面结构：
我的HTML学习笔记 HTML是超文本标记语言，用于创建网页结构。 学习HTML需要掌握各种标签，例如标题、图片、链接等。 作者：小明 时间：2026年7月29日十、总结
| 标签 | 作用 | 是否显示 |
|---|---|---|
<!-- --> | HTML注释 | 不显示 |
<p> | 创建段落 | 显示 |
<br> | 换行 | 显示换行效果 |
重点记忆：
HTML注释用于解释代码，不会显示在网页中
<!-- 注释 --><p>表示一个完整段落
<p>文章内容</p><br>表示强制换行
第一行<br> 第二行写文章内容优先使用
<p>，不要大量使用<br>来模拟段落。