网页翻转

transform中的rotate控制翻转角度而scale控制图片大小

 transition控制翻转的时间

通常有

  -webkit-transform:rotate(-20deg) scale(1);//
  -moz-transform:rotate(-20deg) scale(1);//防止网页不兼容
  transform:rotate(-20deg) scale(1);
  -webkit-transition:1s;
  -moz-transition:1s;
  transition:1s;

z-index 则控制图片的优先性

则出现在所有图片的上方

  border:1px solid #ddd;
  padding:10px;
  border-radius: 10px;
  background-color: #FFF;

控制使图片外围出现图片边框

以上配合伪类(:hover)可以实现网页翻转

原文地址:https://www.cnblogs.com/chengxiangboke/p/9825284.html