仅在顶部、底部和左侧的框阴影

Question

我只想将盒子阴影添加到顶部、底部和左侧 - 没有右侧。

这是我的 CSS 类：

.topBottomLeft{
      box-shadow: inset -1px 0px 0.5px 0.5px #000,inset 0 1px 0.5px 0.5px #000,inset 0 -1px 0.5px 0.5px #000 !important;
}

这是我的 jsfiddle：https://jsfiddle.net/Ly4tocny/

它正在将盒子阴影应用到所有四个侧面。我错过了什么？

Answer 1

您已接近解决方案。您只需要稍微调整一下值。

这是一个适用于您的方法的示例，并添加了一些重点，以便您可以看到我所做的更改。

    box-shadow: inset 0 5px 0.5px 0.5px #000,
    inset 0 -5px 0.5px 0.5px #000,
    inset  5px 0.5px 0.5px #000;

https://jsfiddle.net/ercnvzj7/

我推荐这个，用于将来的阴影：http://css3generator.com/

Answer 2

第一个插入值应该是 1 而不是 -1。

.topBottomLeft {
    box-shadow: inset 1px 0px 0.5px 0.5px #000,inset 0 1px 0.5px 0.5px #000,inset 0 -1px 0.5px 0.5px #000;
}