给图片加阴影效果的CSS

给图片加阴影效果的CSS

CSS代码

.pic {
position:relative;
background:#CCC;
margin:10px;
}
.pic span {
display:block;
border:1px solid #333;
background:#FFF;
position:relative;
padding: 3px;
}
.right {/*阴影在右边时*/
top:-4px;
left:-4px;
}
.left {/*阴影在左边时*/
top:-4px;
right:-4px;
}

 

<ul>
<li class="pic"><span class="right"><img src="pic_shadow.jpg" border=0 alt="pic" /></span></li>
<li class="pic"><span class="left"><img src="pic_shadow.jpg" border=0 alt="pic" /></span></li>
</ul>

 

 html代码