如何在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>