<! DOCTYPE html>
Body{padding:0;margin:0;background:#CEEEFD;}H1{text-align:Center;}. Container{width:960px;Height:500px;margin:20px Auto;position:relative;background:#D7D9F4;Overflow:Hidden;}img{width:350px;Height:250px;padding:5px 5px 10px 5px;background: White;position:Absolute;-webkit-transition:0.5s;-moz-transition:0.5s;transition:0.5s;Z-index:1;}. img_1{Top:0px; Left:220px;-webkit-transform:Rotate (20deg);-moz-transform:Rotate (20deg);Transform:Rotate (20deg);}. Img_2{Top:0px; Left:20px;-webkit-transform:Rotate ( -10deg);-moz-transform:Rotate ( -10deg);Transform:Rotate ( -10deg);}. Img_3{Top:50px; Right:40px;-webkit-transform:Rotate ( -5deg);-moz-transform:Rotate ( -5deg);Transform:Rotate ( -5deg);}. Img_4{Top:50px; Right:100px;-webkit-transform:Rotate (30deg);-moz-transform:Rotate (30deg);Transform:Rotate (30deg);}. Img_5{Top:200px; Left:300px;-webkit-transform:Rotate ( -15deg);-moz-transform:Rotate ( -15deg);Transform:Rotate ( -15deg);}. Img_6{Top:200px; Left:50px;-webkit-transform:Rotate ( -20deg);-moz-transform:Rotate ( -20deg);Transform:Rotate ( -20deg);}. Img_7{Bottom:50px; Right:30px;-webkit-transform:Rotate (30deg);-moz-transform:Rotate (30deg);Transform:Rotate (30deg);}Img:hover{-webkit-transform:Rotate (0deg);-moz-transform:Rotate (0deg);Transform:Rotate (0deg);Box-shadow:10px 10px 15px Gray;Z-index:2;}
Early in the morning to--CSS3 achieve photo wall effect