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

Question

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

这是我的 CSS class:

.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;
}