aside figure figcaption
<aside> 表示与主内容"相关但可剥离"的部分：侧边栏、推荐阅读、名词注释框。判断方法是删掉它主内容依然完整成立。
<figure> 包裹"独立引用的内容块"——图片、图表、代码示例、公式都可以，配对的 <figcaption> 给它一个标题说明，可以放在 figure 的开头或结尾。这与单独的 img+alt 不同：figcaption 是显示出来的正式说明文字，常用于"图 1-2：某某示意图"这种场景。
figure 的价值在于内容与说明被绑定成一个语义整体，屏幕阅读器会先读出"这是带说明的图表"，对内容密集的文档站很有用。
本节要点aside = 可剥离的辅助内容（侧栏/注释）；figure 包图表代码等独立内容块，figcaption 提供说明文字，两者配对使用。
HTML
<main> <article> <h1>浏览器渲染原理</h1> <p>正文内容……</p> <!-- figure：图表与说明绑定为一个整体 --> <figure> <img src="render-flow.png" alt="浏览器渲染流程图"> <figcaption>图 1：从 HTML 到像素的渲染流程</figcaption> </figure> <!-- aside：删掉不影响正文完整性 --> <aside> <h4>名词解释</h4> <p>重排（reflow）：重新计算元素几何属性的过程。</p> </aside> </article> </main>
