说到鼠标悬停元素上移，首先想到的是鼠标悬停时元素上移，然后应用transition来实现渐变效果。
1、使用top实现（该实现方式chrome浏览器闪烁，避免使用）
<!--html-->
<div class="test"></div>
/*css*/
.test {
position: relative;
top: 0;
transition: top 0.5s;
}
.test:hover{
top: -10px;
}2、使用transform实现（推荐）
<!--html-->
<div class="test"></div>
/*css*/
.test {
transform: translateY(0);
transition: transform 0.5s;
}
.test:hover{
transform: translateY(-10px);
}
