html - 背景内部淡入淡出

Question

我有一张背景图片HERE对于侧边栏。想只使用 CSS 制作这个背景，这可能吗？

侧边栏的高度，根据内容变化<div>

这就是我不能使用背景图片的原因。

Answer 1

一种可能性是，您可以结合 css 渐变和框阴影。css 渐变将提供 LHS RHS 阴影，而框阴影将提供 TOP 阴影。因此底部边缘可以保持与 OP 图像相同。这是 DEMO

.shadow_grad
{
  height: 200px;
  width: 100px;
  //shadow
  box-shadow: 0 5px 20px 0 rgb(0, 0, 0) inset;
  //gradient part included in fiddle, cant paste here as its long

}