如何设置一个盒子阴影的div元素的所有方面,左阴影,右阴影,顶部阴影,底部阴影?

问题描述:

我不能创建另一个父级div容器,它可能只使用css技巧吗? box-shadow:7px 7px 7px black; 只会从右侧和底部边框创建阴影,但我也需要左侧和顶部。如何设置一个盒子阴影的div元素的所有方面,左阴影,右阴影,顶部阴影,底部阴影?

+0

看看这个:http://*.com/questions/3467452/css-shadows-all-four-sides-of-div –

+0

各方影子?为什么不能简单地使用边框或图像来创建这种效果?我不确定是否可以在一个div上合并两个阴影。 – OptimusCrime

+0

'我的背景颜色正在动态变化,这不是一项好工作。 –

带箱影有4个参数;偏移量,模糊半径,传播和颜色。

这是我在我的网站上使用的代码。它产生一个具有0偏移和模糊半径,8px扩展和阴影灰色的阴影。

box-shadow: 0 0 8px #888888; 
-moz-box-shadow: 0 0 8px #888888; 
-webkit-box-shadow: 0 0 8px #888888; 

下面是对图像效果的一个简单示例。

Quick example of the effect on an image

http://www.css3.info/preview/box-shadow/

试试这个

box-shadow:2px 2px 10px 10px #C9C9C9; 
-webkit-box-shadow:2px 2px 10px 10x #C9C9C9; 
-moz-box-shadow:2px 2px 10px 10px #C9C9C9; 

可以使用shadowOn。这是一个很棒的jQuery插件,使用起来非常简单。