用对语义标签（如、、、）能确保结构清晰、重点明确、无障碍友好且利于seo；实现真正分段，表强重要性，表语气强调，用于上下文高亮。
<p></p>、<strong></strong>、<em></em>、<mark></mark> 这几个标签用对了，基本网页文本就能立住——不需要 CSS 也能看得清结构、分得清重点。
什么时候该用 <p></p> 而不是连续敲回车
浏览器会忽略 HTML 源码里的换行和空格，连续写三行文字不加标签，它会全挤成一行。用 <p></p> 才真能分段。
-
<p></p>自带上下外边距，段与段之间有呼吸感；<br>只是强制换行，没语义、没间距 - 别用多个
<br>模拟段落——那是早期 hack，现在会被当成可访问性缺陷 - 标题（
<h1></h1>–<h6></h6>）和段落要嵌套合理：<h2></h2>后跟<p></p>是自然流，但不要把<p></p>套在<h2></h2>里面
<strong></strong> 和 <b></b> 看起来一样，为什么推荐前者
视觉上都加粗，但语义完全不同：<strong></strong> 表示内容有强重要性（屏幕阅读器会重读），<b></b> 仅表示“想让它醒目一点”，无语气含义。
- 价格、警告、必填项用
<strong></strong>；品牌名、产品型号等单纯强调用<b></b> - 搜索引擎和辅助工具依赖语义标签，乱用
<b></b>会让它们误判重点 - 现代项目里，
<strong></strong>更容易被 CSS 统一接管样式（比如统一改粗细或加颜色）
<em></em>、<i></i>、<mark></mark> 的分工边界在哪
它们都不是“随便加个样式”的开关，每个都有明确的语义职责：
-
<em></em>：表达语气上的强调（如反语、转折），屏幕阅读器会改变语调 -
<i></i>：表示不同语言词、术语、船名、生物分类名等——不是为了斜体而斜体 -
<mark></mark>：高亮页面中与当前用户查询或上下文相关的内容（比如搜索结果页的关键词匹配） - 别用
<mark></mark>给整段话上色，它本意是“临时标记”，不是设计装饰
最常被忽略的一点：这些标签本身不带默认字体大小或颜色变化（除了加粗/斜体/黄底），但它们的语义会影响 SEO 权重分配、无障碍朗读节奏和未来 CSS 的可维护性——写对标签，比调对颜色更重要。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
