HTML注释与段落、换行标签详解

📅 2026/7/30 2:05:09
HTML注释与段落、换行标签详解
一、HTML注释Comment1. 什么是HTML注释在 HTML 中注释Comment是用于给开发者添加说明文字的内容浏览器不会把注释内容显示在网页中。HTML注释主要用于解释代码功能标记代码区域方便后期维护暂时隐藏某部分HTML代码HTML注释格式!-- 这里是注释内容 --例如!DOCTYPE html html head titleHTML学习/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. 暂时屏蔽代码开发过程中有时候不想删除代码可以使用注释。原代码h1Hello HTML/h1 p学习前端开发/p暂时隐藏!-- h1Hello HTML/h1 p学习前端开发/p --浏览器不会显示Hello HTML 学习前端开发三、HTML注释注意事项1. 注释不能嵌套错误!-- 外层注释 !-- 内层注释 -- --HTML不支持注释里面再写注释。2. 注释符号必须完整正确!-- 注释内容 --错误!-- 注释内容缺少结束符--可能导致页面解析异常。四、HTML段落标签p1. 什么是段落标签p是 HTML 中表示**段落paragraph**的标签。语法p段落内容/p例如p HTML是一门用于创建网页结构的语言。 /p p CSS负责网页样式设计。 /p浏览器显示HTML是一门用于创建网页结构的语言。 CSS负责网页样式设计。可以看到两个p标签之间自动产生了一定间距。五、为什么使用p标签很多初学者喜欢这样写HTML是一门语言 CSS负责样式 JavaScript负责交互但是HTML无法正确识别这些文字之间的关系。正确方式pHTML是一门语言/p pCSS负责样式/p pJavaScript负责交互/p这样浏览器知道第一段文字是一段内容第二段文字是另一段内容第三段文字是另一段内容六、HTML换行标签br1. 什么是换行标签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 titleHTML学习博客/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文章内容/pbr表示强制换行第一行br 第二行写文章内容优先使用p不要大量使用br来模拟段落。