屏幕阅读器忽略html中所有类型空格（包括普通空格、 、 、 等），不朗读、不停顿；需用语义化标签、aria属性或css控制可访问性节奏。
HTML 中的普通空格会被屏幕阅读器忽略
连续的普通空格（ 以外的空格，比如键盘敲出的空格、换行缩进）在 HTML 渲染时会被浏览器合并为一个空格，且绝大多数屏幕阅读器（如 NVDA、VoiceOver、JAWS）默认跳过这些“无语义空格”——它们不读、不暂停、不视为分隔符。
这意味着：用多个空格对齐文字、靠空格缩进段落、或在标签间加空格排版，都不会影响屏幕阅读器的行为。但这也带来隐患：你自以为的“视觉分隔”，对听觉用户根本不存在。
- HTML 源码里写
<p>用户名：</p> <p>张三</p> <p><span>立即学习</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记（深入）</a>”；</p>，中间换行+缩进产生的空格被完全忽略 - 写
<span>状态</span> <span>在线</span>，中间一个空格 → 屏幕阅读器读作“状态在线”，无停顿 - 想让“状态”和“在线”之间有自然停顿？不能靠多加空格，得用语义化方式
和 等实体空格也不触发朗读
（不间断空格）、 （窄空格）、 （全角空格）本质仍是“空白字符”，只是不会被合并或换行。屏幕阅读器仍然不读它们，也不会因此增加停顿。
它们只影响视觉渲染：防止断行、控制间距宽度。无障碍层面，它们和普通空格一样“透明”。
<p>订单号：<code> </code><code> </code><code> </code>A2024001</p><div class="aritcle_card flexRow">
<div class="artcardd flexRow">
<a class="aritcle_card_img" href="/ai/2067" title="Pixelfox AI"><img
src="https://img.php.cn/upload/ai_manual/000/000/000/175680175146446.png" alt="Pixelfox AI" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a href="/ai/2067" title="Pixelfox AI">Pixelfox AI</a>
<p>多功能AI图像编辑工具</p>
</div>
<a href="/ai/2067" title="Pixelfox AI" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a>
</div>
</div>
上面这段代码中，三个 在视觉上制造了缩进，但 VoiceOver 仍会连续读作“订单号：A2024001”，中间无间隙、无强调。
真正影响屏幕阅读器停顿的是语义结构和 ARIA 属性
要让两个词之间产生可感知的停顿或区分，必须借助语义容器或明确声明：
- 用
<span></span>包裹并添加aria-label或aria-hidden="true"控制是否朗读 - 用
<div> 或 <code><section></section>分组，配合role="group"或aria-labelledby - 插入
<span aria-hidden="true"> </span>可确保空格不干扰朗读，同时保留视觉间距 - 更推荐：直接用 CSS
margin/padding控制间距，避免在内容流中塞空格
例如，想让“剩余：5条”中的冒号后有短暂停顿，不要写 剩余： 5条，而应：
<span>剩余：</span><span aria-label="五">5</span><span>条</span>
这样屏幕阅读器可能读作“剩余：五 条”（取决于引擎和语言设置），比纯空格更可控。
CSS white-space 对屏幕阅读器几乎无影响
即使设 white-space: pre 或 pre-wrap 让空格/换行生效，屏幕阅读器依然按 DOM 结构和语义朗读，而非按空格数量停顿。它不会因为某处多了三个空格就多停三拍。
唯一例外是极少数场景：当空格出现在 <textarea></textarea> 或 <pre class="brush:php;toolbar:false;"></pre> 中且内容本身是代码/日志等需逐字传达时，部分阅读器可能读出“空格”二字——但这属于内容语义，不是排版空格的副作用。
所以别指望靠 white-space 调节可访问性节奏；该用标题、列表、aria-describedby 的地方，一个都不能少。
