阴影效果 CSS+DIV

 

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "<a href="http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd" target="_blank" > http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd </ a > ">
< html  xmlns ="<a href=" http://www.w3.org/1999/xhtml" target ="_blank" > http://www.w3.org/1999/xhtml </ a > "  >
< head >
< style >
#w{}{ width:200px; font-size:12px; margin-left:auto; margin-right:auto;}
.ac {}{
  display:block; 
  background:#bbbbbb; 
  border:1px solid #dddddd; 
  position:relative;
  margin:1px 0;
  }
.bc {}{
  display:block; 
  background:#777777; 
  border:1px solid #999; 
  position:relative;
  padding:1px;
  margin:1px;
  }
.cc {}{
  text-align:center; 
  background:#ffffff; 
  border:1px solid #555; 
  position:relative; 
  padding:5px;
  font-weight:normal;  }

.dc{}{
 background-color: #CCCCCC;
 border: 1px solid #999999;
}
</ style >
</ head >
< body >
< div  id ="w" >
   < div  class ="ac" >
     < div  class ="bc" >
       < div  class ="cc" >
         < div  class ="dc" >
           < p > 这是一张图片 </ p >
         </ div >
       </ div >
     </ div >
   </ div >
</ div >
</ body >
</ html >