给图片添加阴影

在图片后添加阴影

将图片元素内嵌在div元素中,并将div元素的class属性置为 imgholder;

<div class="imgholder">
  <img src="dadsaranick2.jpg" alt="Photo of Dad,Sara,Nick"/>
</div>

div.imgholder {
  float:left;
  background: url(dropshadow.png) no-repeat bottom
   right !important;
  background: url(dropshadow.gif) no-repeat bottom right;
  margin: 10px 7px 0 10px !important;
  margin: 10px 0 0 5px;
}

对图片本身,我们设置margin-right和margin-bottom属性来决定阴影域的大小,而边框和内间距的应用将使整个画面更具立体感
div.imgholder img {
  display: block;
  position: relative;
  background-color: #fff;
  border: 1px solid #666;
  margin: -3px 5px 5px -3px;
  padding: 2px;
}