固定列阴影被穿透的本质是z-index层级未压住滚动内容，需对.layui-table-fixed-l/r设z-index≥10、position:relative、overflow:visible及对应box-shadow，并修正.layui-table-box的padding和外层溢出控制。
固定列阴影被穿透，本质是 z-index 层级没压住滚动内容，不是 box-shadow 本身的问题。
为什么 fixed 列阴影会“被盖住”或“消失”
layui 固定列实际是用三个独立 <table> 容器拼出来的（左固定、中间滚动、右固定），它们默认同级渲染；当横向滚动时，中间表格的单元格会物理上覆盖在固定列容器之上——哪怕你给固定列加了 <code>box-shadow，也会被上面那层 DOM 盖掉。
- 不是 CSS 写错了，而是 DOM 结构导致阴影绘制区域被遮挡
-
position: sticky或position: absolute不足以提升阴影层级，必须靠z-index显式控制堆叠顺序 - 固定列容器类名是
.layui-table-fixed-l和.layui-table-fixed-r，但它们的父级.layui-table-box默认overflow: hidden，会裁掉超出部分的阴影
给 .layui-table-fixed-l/r 加阴影的最小可行方案
直接操作固定列容器，不碰 <table> 本身：
<ul>
<li>必须同时设 <code>z-index（推荐 10 起步）和 position: relative 才能触发层叠上下文
box-shadow: 2px 0 6px -2px rgba(0,0,0,.1)（右侧阴影）或 -2px 0 6px -2px rgba(0,0,0,.1)（左侧）overflow: visible 到固定列容器，否则阴影被 .layui-table-box 截断.layui-table-fixed-l {
z-index: 10;
position: relative;
overflow: visible;
box-shadow: -2px 0 6px -2px rgba(0,0,0,.1);
}
.layui-table-fixed-r {
z-index: 10;
position: relative;
overflow: visible;
box-shadow: 2px 0 6px -2px rgba(0,0,0,.1);
}
配合 .layui-table-box 的关键修正
如果固定列阴影仍被裁，大概率是外层 .layui-table-box 的 overflow: hidden 在作祟：
- 不要删它（否则滚动条失效），而是给它加
padding-left: 4px（左固定列）或padding-right: 4px（右固定列）留出阴影空间 - 若同时用了卡片容器（如
.layui-card），需确认其overflow: hidden是否套得太深，必要时加z-index: 1和position: relative - 避免在
templet里写内联style="box-shadow:..."—— 固定列的<td> 是动态生成的，且会被 layui 重写样式 <h3>动态列宽/拖拽排序下如何保阴影不丢</h3> <p>当用户拖动列宽或调整顺序时，<code>.layui-table-fixed-l/r容器可能被销毁重建，CSS 类会丢失：- 用
table.on('init')或done回调中重新加 class，比纯 CSS 更稳 - 别用
$('body').append('<style>...</style>')动态插样式，容易重复或冲突 - 推荐封装一个函数，在每次
table.reload()后调用：fixShadowForFixedCols(tableIns)
真正难的不是加阴影，而是让阴影始终“浮在最上层又不破坏滚动逻辑”——z-index、overflow、position 三者必须咬合，少一个都会穿帮。
- 用
