理解 <em> 标签的语义作用及其与视觉斜体的区别
掌握 <em> 标签的基本语法和典型使用场景
能够区分 <em>（强调）与 <i>（纯斜体）的适用场合
了解该标签在可访问性和多语言环境中的表现
<em>HTML 中的 <em> 标签用于语义化地强调文本，表示该部分内容在上下文中需要被特别注意或带有语气重音。虽然浏览器默认将其渲染为斜体，但其核心价值在于传达语义，而非仅仅改变字体样式。
关键点：
<em>表示“这里需要强调”，而不仅仅是“看起来是斜体”。
这种强调在以下场景中尤为重要：
口语化表达中的重音（如“我真的没说谎！”）
对比或澄清（如“不是速度，而是稳定性更重要”）
外语词汇或术语的首次引入（在某些文体中）
<em>需要强调的文本</em><em> 是一个行内元素，可嵌套在段落、标题、列表项等文本容器中。
支持所有 HTML 全局属性（如 class、id、lang）和 事件属性（如 onclick）。
默认样式通常为 font-style: italic，但可通过 CSS 覆盖。
<!DOCTYPE html>
<html>
<body>
<h2>HTML em 标签</h2>
<p>请务必阅读这份文档，尤其是<em>安全注意事项</em>部分。</p>
<p>他强调：“我<em>从未</em>同意这个方案。”</p>
</body>
</html>渲染效果：
“安全注意事项” 和 “从未” 将以斜体显示；
更重要的是，屏幕阅读器在朗读时通常会加重语气或改变语调，以传达强调意图。
<em> 与 <i> 的区别<em> 支持嵌套，用于表示更强的强调：
<p>这不仅仅是错误，这是<em>完全<em>不可接受</em>的行为</em>！</p>在支持的浏览器和阅读器中，最内层可能以更强烈的语气或不同音调呈现；
视觉上可能仍为斜体，但语义层级更丰富。
虽然默认为斜体，但可根据设计需求修改：
<style>
.emphasis {
font-style: normal;
background-color: yellow;
font-weight: bold;
}
</style>
<p>这是<em class="emphasis">自定义强调</em>效果。</p>此时文本不再斜体，但语义强调依然存在。
<em> 标签用于语义化强调，表示文本在上下文中需被特别注意或带有语气重音。
默认视觉表现为斜体，但核心价值在于可访问性和语义表达。
与无语义的 <i> 标签有本质区别：<em> 影响朗读语气，<i> 仅改变外观。
支持嵌套以表达多级强调，适用于对话、警告、澄清等场景。
可通过 CSS 自定义样式，但应保留其语义用途。
在一段产品说明文案中，“免费试用”是否应该用 <em> 强调？为什么？如果只是品牌风格要求斜体显示，又该如何处理？
如果你希望在移动端和桌面端对 <em> 使用不同的强调方式（如移动端加背景色，桌面端用斜体），应如何通过 CSS 实现？
为什么在无障碍设计中，使用 <em> 比直接用 CSS 设置 font-style: italic 更重要？请从屏幕阅读器用户的角度分析。