3D旋转
//html
<div class="logo">
<a href="">
<h1>知海匠库</h1>
<p>互  联  网  匠  人  孵  化  连  锁  品  牌</p>
</a>
</div>
//css
*{
margin: 0;
padding: 0;
}
.logo{
width: 300px;
height: 120px;
text-align: center;
background: blue;
border-radius: 10px;
position: relative;
}
h1,p{
color: white;
}
h1{
width: 280px;
font-size: 65px;
margin-left: 10px;
border-bottom: 5px solid white;
}
p{
width: 280px;
margin-left: 10px;
}
.logo:hover{
transform: rotateY(30deg); ///重要代码
transition: all 2s;
}
rotateX()绕X轴方向旋转
rotateY()绕Y轴方向旋转
rotateZ()绕Z轴方向旋转
rotate(x,y,z,angle)