block-size 在 html 表格元素上基本无效，因其渲染模型不支持逻辑尺寸轴向映射；仅对表格外部容器或纯块级包装层在明确切换 writing-mode 时才安全可用。
不能直接用 block-size 控制 HTML 表格的“高度”行为，除非你主动切换了 writing-mode；默认 horizontal-tb 下，block-size 和 height 完全等价，且表格元素对 block-size 的继承与计算有特殊限制。
为什么 block-size 在 <table> 上基本无效
<p>HTML 表格的渲染模型（table formatting context）不原生支持逻辑尺寸属性的轴向映射。即使你给 <code><table> 设置 <code>block-size: 200px，浏览器仍按传统物理盒模型处理：它只在 writing-mode: vertical-rl 等非默认模式下才可能触发块轴切换，但此时表格结构本身（如 <tr>、<code><td>）会因轴向错位而崩溃或渲染异常——不是属性没生效，而是表格布局引擎不配合逻辑轴。
<ul><li><code><table>、<code><tr>、<code><td> 的 <code>display 值（如 table-cell）不响应 block-size 的逻辑映射规则
writing-mode: vertical-rl，子 <td> 仍默认以 <code>horizontal-tb 计算自身 block-size，不会自动继承或适配
block-size 对表格元素的 height 控制效果 ≈ height，无逻辑优势，反增调试成本真要实现逻辑维度高度控制，必须绕开原生表格结构
如果你确实需要竖排（writing-mode: vertical-rl）下的“高度”随内容逻辑伸缩（比如日文竖排报表），唯一可靠路径是放弃 <table>，改用 CSS Grid 或 Flex 模拟表格语义：
<ul><li>用 <code>display: grid + grid-template-columns 搭建列结构，每个单元格用 display: contents 或语义化 <div role="cell"> 替代 <code><td>
<li>在容器上设 <code>writing-mode: vertical-rl，再对单元格使用 block-size: 100px —— 此时它真正控制的是“物理宽度”，符合竖排预期
padding-block、border-block，否则内边距仍走物理方向，视觉错位box-sizing: border-box 依然作用于块轴，但需确认该轴是否已被 writing-mode 切换
block-size 在表格相关场景中唯一安全的用法
仅限于**表格外部容器**或**纯块级包装层**，且明确存在书写模式切换需求时：
- 包裹整个
<table> 的 <code><div class="table-wrapper"> 设 <code>writing-mode: vertical-rl，再用block-size: 400px控制其“逻辑高度”（即实际宽度） - 表格标题栏（
<thead> 单独抽离为 <code>div）配合block-size做固定逻辑尺寸，避免和表格主体耦合 - 绝对不要对
<tr> 或 <code><td> 直接设 <code>block-size并期望它替代height—— 浏览器兼容性差，Safari 16.x 甚至会忽略 - 百分比值（如
block-size: 80%）基准是父容器的块轴尺寸，若父未设writing-mode，它就是父高；若父是vertical-rl，它就变成父宽，极易误判
真正落地 block-size 的门槛不在语法，而在整套逻辑属性链：必须同步改 writing-mode、padding-block、margin-block、border-block，且确保所有嵌套层级都按同一逻辑轴解释尺寸。表格这种强物理结构的元素，天然抵触这套机制——别硬套，该换结构就换结构。
