鼠标移动上去,元素旋转;web前端鼠标经过图片凸起


.trans-rotate{
    -webkit-transition: transform .25s linear;
    -moz-transition: transform .25s linear;
    -o-transition: transform .25s linear;
    transition: transform .25s linear;
}/* 加上这个样式后,才会在0.25秒内旋转完毕。否则只会显示立刻旋转完的结果 */

.btnbg:hover{transform:rotate(360deg);}    /* 鼠标移上去后,旋转*/

  在需要旋转的元素上加上 class="btnbg trans-rotate"

 

 

web前端鼠标经过图片凸起

在需要这种特效的img标签上加上class=".img-aoqi"

.img-aoqi{
	-webkit-transition: all ease-out .5s;
    -o-transition: all ease-out .5s;
    transition: all ease-out .5s; 
    -ms-transition: all ease-out .5s;
}
.img-aoqi:hover{
	-webkit-transform: scale(1.08);
    -o-transform: scale(1.08);
    transform: scale(1.08);
    -ms-transform: scale(1.08)
}

  


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM