使用CSS为整个HTML表格列设置阴影

如何为包含多行的整个HTML表列设置阴影

在

col

上设置

box shadow

无效，而在

td

上设置

box shadow

会在每个

td

周围添加阴影，因此它看起来像是每个单元格周围的边框，而不是整个列周围的单个边框

<table>
  <colgroup>
    <col>
    <col>
  </colgroup>
  <thead>
    <tr>
      <th></th>
      <th>
        <h2>...</h2>
      </th>
      <th>
        <h2>...</h2>
      </th>
      <th>
        <h2>...</h2>
      </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th></th>
      <td>...</td>
      <td>...</td>
      <td>...</td>
    </tr>
    <tr>
      <th></th>
      <td>...</td>
      <td>...</td>
      <td>...</td>
    </tr>
  </tbody>
</table>

...
...
...
...
...
...
...
...
...

如果评论提供了任何可视性或想法，则将其转化为答案

---

用渐变来伪装阴影可以吗？背景是您可以通过col元素添加的唯一样式

阴影平均3倍，根据需要更新渐变停止/开始值和颜色。

表格{
边界间距：4px0；
保证金：1em自动；
}
th，td{
填充：1em 2em；/*演示*/
}
上校{
背景：
线性渐变（至底部，白色0，透明3px，透明3px），
线性渐变（到顶部，白色0，透明3px，透明3px），
线性渐变（向左、白色、灰色3px、透明3px），
线性渐变（向右、白色、灰色3px、透明3px），
线性渐变（至顶部、白色、灰色3px、透明3px），
线性渐变（至底部、白色、灰色3px、透明3px）黄色
}
第n个孩子（单数）{
背景色：番茄；
}

....
...
...
...
...
...
...
...
...
...

你能试试这个吗？以列上的第一个和最后一个元素为目标，使其具有特定的阴影，使其看起来像阴影应用于整个列。使用渐变来伪造阴影是否可以完成此任务？背景是您可以通过col元素添加的唯一样式。谢谢，但是我仍然无法在角落中正确地添加背景，并且当我为某些行指定不同的背景颜色时。我可能不得不换成Flexbox表格。