z-index 对 本身仅控制其整体层级，对内部 无效，因 table-cell 等元素不创建层叠上下文；可靠方案是用定位包裹子元素或改用 grid/flex 布局。
z-index 对 表格是 display: table 的原生格式化上下文，其内部单元格（<table> 元素本身基本无效，不是设置“层叠高度”的正确方式；真正起作用的是对 <code><tr>、<code><td> 或其包裹容器应用定位 + <code>z-index，且必须考虑表格内部的隐式层叠上下文限制。
为什么直接给
<table> 设 <code>z-index 没用？
<td>、<code><th>）默认为 display: table-cell，而 <code>table-cell 元素即使加了 position: relative，z-index 也不触发层叠上下文（CSS 规范明确排除）。这意味着：
<table> 上写 <code>position: relative; z-index: 100 —— 可生效，但只控制整个表格相对于其他块级元素的层级
<tr> 或 <code><td> 上设 <code>position: relative; z-index: 999 —— 大概率被忽略，因为 table-cell 不支持创建堆叠上下文
<td> 当作“无 z-index 能力”的参与方，按 HTML 顺序和默认层叠规则渲染，数值完全不比较
<h3>想让某行/某单元格“浮起来”，该怎么做？</h3>
<p>绕过表格原生限制的可靠做法是：把目标内容抽离出表格流，用定位容器包裹并脱离 <code>table-cell 环境：
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
- 给需要突出的
<td> 加 <code>position: relative，再在其内部插入一个<div class="overlay">，并设 <code>position: absolute; z-index: 100 - 或者，把整行
<tr> 替换为 <code>display: block+position: relative的 div 模拟，放弃原生表格语义（仅限非数据展示场景） - 更稳妥的 UI 方案：用 CSS Grid 或 Flex 模拟表格布局，所有子项天然支持
position和z-index - 避免对
<thead> 或 <code><tbody> 直接设 <code>z-index—— 它们是 display: table-header-group/table-row-group，同样不创建独立堆叠上下文z-index在表格相关 DOM 中的实际生效边界能稳定使用
z-index的节点，必须同时满足两个条件：已定位 + 属于可创建堆叠上下文的 display 类型。对照来看：<table>：display: table → ✅ 可设 <code>position+z-index（影响整体）<tbody> / <code><thead>：display: table-row-group → ❌ 即使 <code>position: relative，z-index无效<tr>：display: table-row → ❌ 同上，规范禁止其成为 stacking context 根 <li><code><td> / <code><th>：display: table-cell → ❌ 不支持 <code>z-index（哪怕强行加position）- 包裹在
<td> 内的 <code><div>：display: block → ✅ 只要设 <code>position: relative/absolute，z-index立即生效真正容易被忽略的点是：表格结构本身会抑制堆叠上下文传播。哪怕你给
<table> 设了 <code>z-index: 1000，它内部所有<td> 的子元素若想突破这个“玻璃天花板”向上盖住外部元素，必须确保父链上没有意外的 <code>opacity、transform或filter—— 这些属性会让<table> 自身变成一个封闭的 stacking context，子元素再高的 <code>z-index也出不去。
