小效果储备

点击图片有个变化效果
.index_news_img img{
    display: block;
    height: 258px;
    width: 386px;
    transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
}
.news_list li:hover .index_news_img img{
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    
}
翻转效果
.dl_icon{
    width: 100%;
    max-width: 130px;
    margin: 0 auto;
    border: 1px solid #EBEBEB;
    border-radius: 50%;
    position: relative;
    transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
}
.dl_ul li:hover .dl_icon{
    transform:rotateY(180deg);
    -ms-transform:rotateY(180deg);
    -moz-transform:rotateY(180deg);     
    -webkit-transform:rotateY(180deg);
    -o-transform:rotateY(180deg);
}