<p class="sycode"> <br> </p> <br> <title>CSS3 Drop-shadow阴影</title> <br> <style type="text/css"> <br /> .drop-shadow { <br /> width: 500px; <br /> height: 300px; <br /> position: relative; <br /> background: #ccc; <br /> } <br /> .drop-shadow:before, <br /> .drop-shadow:after { <br /> content: ""; <br /> position: absolute; <br /> z-index: -1; <br /> bottom: 15px; <br /> width: 30%; <br /> height: 20%; <br /> /*add box-shadow*/ <br /> -webkit-box-shadow: 0 15px 10px rgba(125,125,125,0.8); <br /> -moz-box-shadow: 0 15px 10px rgba(125,125,125,0.8); <br /> box-shadow: 0 15px 10px rgba(125,125,125,0.8); <br /> } <br /> .drop-shadow:before{ <br /> left:5px; <br /> -webkit-transform: rotate(-3deg); <br /> -moz-transform: rotate(-3deg); <br /> -o-transform: rotate(-3deg); <br /> transform: rotate(-3deg); <br /> } <br /> .drop-shadow:after { <br /> right:5px; <br /> -webkit-transform:rotate(3deg); <br /> -moz-transform:rotate(3deg); <br /> -o-transform:rotate(3deg); <br /> transform:rotate(3deg); <br /> } <br /> </style> <br> <br> <br> <div><a href="http://www.999jiujiu.com/"> http://www.999jiujiu.com/</a></div> <br> <div class="drop-shadow"></div> <br> <br>
