应优先使用语义化标签（如<strong>、<em>）和CSS控制样式，而非<b>、<i>、<u>等纯物理样式标签，以保障可访问性、SEO、打印及多端一致性。
直接用 <b>、<i>、<u> 就是定义物理样式，但得清楚它们不带语义
这三个标签的作用非常明确：<b> 强制加粗、<i> 强制斜体、<u> 强制加下划线。它们只告诉浏览器“这么显示”，不暗示“为什么这么显示”。比如合同里标价格用 <b>，外语术语用 <i>，链接提示文字用 <u>，都算合理场景。
常见错误是拿 <b> 当 <strong> 用，或把 <i> 当 <em> 用——结果是屏幕阅读器不会重读，SEO 也不识别强调意图。如果只是排版需要，没问题；如果想传达重要性或语气，就该换逻辑标签。
<u> 在现代 HTML 中默认有样式风险，必须显式控制
浏览器对 <u> 的默认渲染在不同版本中差异很大：Chrome 会加浅色下划线并带轻微背景高亮，Firefox 可能只画一条细线，Safari 甚至可能忽略。更麻烦的是，它和超链接的视觉样式高度重叠，用户容易误点。
实际使用时建议始终配合 CSS：
u {
text-decoration: underline;
text-decoration-color: #0066cc;
text-decoration-thickness: 1px;
}
否则容易出现以下问题：
- 在深色背景上，原生
<u>下划线几乎不可见 - 自动换行时，下划线可能断在行尾或跨行错位
- 某些移动端浏览器会禁用
<u>的默认样式以避免干扰触控
嵌套 <b> 和 <i> 不推荐，优先用 CSS 类统一控制
虽然语法上允许 <b><i>加粗斜体</i></b>，但这样写会让结构变重、可维护性下降。尤其当项目里还有字体大小、颜色、间距等需求时，纯靠标签堆叠很快失控。
更稳妥的做法是：
- 用
<span>包裹文本，加自定义 class，例如<span class="label-highlight">警告</span> - 在 CSS 中统一定义：
.label-highlight { font-weight: 700; font-style: italic; color: #d32f2f; } - 保留
<b>/<i>仅用于极简静态内容，比如文档片段、临时 demo 或 CMS 导出的纯 HTML
物理样式标签在可访问性和打印输出中表现不稳定
这是最容易被忽略的一点：<b> 和 <i> 在打印预览里可能完全丢失粗细/倾斜效果，尤其当打印机驱动禁用 CSS 渲染时；而屏幕阅读器对 <u> 基本无特殊处理，甚至可能跳过或误读为链接。
如果你的内容需要兼顾打印、无障碍、多端适配，物理样式标签只能作为最后手段。真正可靠的方案是：
- 用
<strong>和<em>承担语义职责 - 用 CSS 的
font-weight、font-style、text-decoration精确控制外观 - 对关键信息（如法律条款、错误提示）额外加
aria-label或视觉辅助符号（⚠️）
