如何在CSS中实现这种效果？

Question

我想知道如何产生这种效果：

。

右边的白色阴影。

Answer 1

这是通过box-shadow属性完成的。 你可以在这里阅读。

 .example { background: red; box-shadow: 10px 10px 8px rgba(0, 0, 0, .3); height: 200px; width: 200px; } 

 <div class="example"></div> 

Answer 2

使用box-shadow （ https://developer.mozilla.org/en/docs/Web/CSS/box-shadow ）

这是达到预期效果的示例：

 div { width: 300px; height: 100px; background-color: lightgray; box-shadow: 10px 10px 5px #888888; } 

 <div></div>