HTML图片在div中心旋转+变色 鼠标移除后 慢慢恢复原样

来源:互联网 发布:手机淘宝差评怎么改 编辑:程序博客网 时间:2024/04/30 12:17

//鼠标移除后 慢慢恢复原样

列   th

th{   transition: all 2s;  }

th:hover{

//变为原来的几倍大小

transform: scale(1.4);

}



<style>.divz {width: 500px;height: 500px;margin: 0 auto;position: relative;}.div1 {width: 500px;height: 500px;background-color: blue;}.div2 {width: 50px;height: 50px;position: absolute;display: none;top: 48%;left: 45%;height: 50px;transition: 2s;/*transform: rotate(180deg);*/animation: me 2s;}.divz:hover .div2 {display: block;}@keyframes me {from {}to {transform: rotate(360deg);           background-color: #000000;}}</style>

<div class="divz"><div class="div1"></div><div class="div2"><img src="img/Cutter_2017-11-30 08_29_58.287.png" width="50px" height="50px"></div></div>