小编典典

TR标签内的Box Shadow

css

我正在尝试为TR表格内的元素创建插入框阴影效果,但没有成功。我正在使用以下CSS:

tr {
     -moz-box-shadow: inset 0 0 5px #888;
     -webkit-box-shadow: inset 0 0 5px#888;
     box-shadow: inner 0 0 5px #888;
  }

不可能在tr元素上产生这种效果吗?


阅读 629

收藏
2020-05-16

共1个答案

小编典典

我发现启用a tr来显示a 的唯一方法box-shadowdisplay: block;tr元素上设置a
,尽管这意味着该行将不再与表格宽度匹配:

tr {
    -moz-box-shadow: inset 0 0 5px #888;
    -webkit-box-shadow: inset 0 0 5px #888;
    box-shadow: inset 1px 1px 5px #888;
    display: block;
}

td {
    padding: 0.5em; /* Just to spread things out a bit */
}

这在Firefox 4和Chromium 10.x上都可以使用,但是在Opera 11.01上却 失败 (都在Ubuntu
10.10上运行)。我没有访问Mac或Windows的权限,所以我无法说说Safari或IE如何处理display: blockontr元素,甚至无法运行在不同平台上的Firefox和Chrome。

2020-05-16