当用户将鼠标悬停在一个 HTML 元素上时,我想将它向上移动约 10px。我在 w3schools 上进行了一些研究,但是我没有找到任何有用的信息。他们大部分的动画示例都使用关键帧,我相信那不是我需要的,因为我想在有人悬停在元素上时触发动画。不过我可能错了,这就是我在这里发布帖子的原因。
以下是我要移动的元素:
<div id="arrow">
<a href="#"><i class="fa fa-arrow-down fa-2x"></i></a>
</div>
对于我的CSS:
#arrow {
padding-top: 310px;
color: #5C6B7E;
position: relative;
/* some kind of animation property here? */
}
#arrow:hover {
/* new properties once user hovers */
}
我不确定需要添加什么来使元素向上动画,w3schools上的例子没有太大的帮助。如果有人能指点我正确的方向,我将非常感激。谢谢 Stack Overflow。