标签必须作为的第一个子元素且仅出现一次，紧贴开始标签后，否则语义断裂导致屏幕阅读器无法识别；默认居顶居中，可通过caption-side和text-align控制位置与文字对齐，禁用float、absolute等破坏语义的样式。
<caption></caption> 标签默认就居中，但仅限于表格内部；它不是“字幕”而是表格标题，别和视频 <track></track> 字幕或语义化 <aside></aside> 混用。
为什么 <caption></caption> 看起来没居中？
常见错误现象：<caption></caption> 写在 <table> 外面、或被包裹在 <code><div> 里；又或者 CSS 里写了 <code>text-align: left 覆盖了默认行为。
-
<caption></caption>必须是<table> 的**第一个或最后一个子元素**，且不能嵌套其他块级容器 <li>浏览器默认给它设了 <code>caption-side: top和text-align: center，但这个居中只对文字生效，不控制自身位置 - 如果父
<table> 宽度不满屏，<code><caption></caption>文字会相对于表格居中，而不是整个页面 - 想让它在整页居中？得控制
<table> 自身：加 <code>margin: 0 auto或用 Flex 包一层<caption></caption>的对齐方向能改吗？能，用
caption-side控制上下位置，用text-align控制文字方向——但注意，这两个属性作用对象不同。-
caption-side: top | bottom | left | right：决定标题贴在表格哪一边（IE 不支持left/right） -
text-align: center | start | end：只影响标题里的文字，不影响<caption></caption>元素在表格中的横向位置 - 想让
left侧标题的文字右对齐？得额外加text-align: right - 不要写
align="center"—— HTML5 已废弃，部分浏览器会忽略
真要实现“视频字幕”或“旁白式字幕”，别用
<caption></caption><caption></caption>是为表格服务的，语义和渲染逻辑都跟媒体字幕无关。视频字幕该用<track></track>，旁白说明该用<aside></aside>或带 ARIA 的<div>。<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> <ul> <li> <code><track kind="subtitles"></track>：由浏览器渲染，位置/样式受限，但可访问性好 -
-
<aside class="subtitle"></aside>：完全自定义，需手动控制定位，推荐用 Flex +justify-content: center居中 - 用
position: absolute+transform: translate(-50%, -50%)实现精确定位时，父容器必须有position: relative - 别给
<caption></caption>强加position: absolute——它会脱离表格流，语义崩坏，屏幕阅读器可能跳过
真正容易被忽略的是语义边界：<caption></caption> 不是“任何带字的横条”，它是表格不可分割的一部分；一旦拿它冒充字幕，后续维护、SEO、无障碍都会出隐性问题。
