关于一个小箭头的网页特效

请问极客学院里的小箭头，当鼠标悬浮放上去，会发生旋转的动画，如何实现~谢了

css javascript html 前端

阅读 3k

2 个回答

得票最新

xicodez

411

发布于
2016-10-19

✓ 已被采纳

去极客学院看了一下，没找到你说的箭头。动手写一个给你。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>arrow</title>
  <link href="http://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
</head>
<style type="text/css">
  .icon {
    display: flex;
    justify-content: center;
  }
  #icon {
    transition: 1s;
  }
  #icon:hover {
    transform: rotate(90deg);
  }
</style>
<body>
  <div class="icon">
    <span id="icon" class="glyphicon glyphicon-arrow-right"></span>
  </div>
</body>
</html>

采纳哟！