CSS3框阴影：两者，外部和内部

是否有可能创build一个3D效果的外部阴影和内部embedded发光？ 我有一个石灰绿背景的div在蓝色的顶部。 到目前为止，我有以下几点：

.greendiv{ background:darkgreen; box-shadow: box-shadow: 10px -7px 15px darkgray; box-shadow: lightgreen 0px 0px 3px inset; } 

实际的颜色是#ffffff格式。 看来第二个声明取消了第一个声明。 有没有解决的办法？

Answer 1

您只需声明一次box-shadow ，然后在里面使用两个版本，用逗号分隔：

http://www.w3.org/TR/css3-background/#the-box-shadow

“box-shadow”属性将一个或多个阴影添加到框中。 该属性是一个逗号分隔的阴影列表，每个阴影都由2-4个长度值指定，可选颜色和可选的“inset”关键字。

所以，对于你：

 .greendiv { background: darkgreen; box-shadow: 10px -7px 15px darkgray, lightgreen 0px 0px 3px inset; } 

请参阅： http : //jsfiddle.net/JzsAh/