css - 如何使用 CSS3 为箭头设置动画,使其看起来像是在增长?

标签 css

我有以下箭头图片 arrow

我想实现的是通过CSS让这个箭头出现(增长)。

我怎样才能做到这一点?如果可能的话,我更喜欢仅使用 CSS3 的解决方案。

最佳答案

<!DOCTYPE html> 
<html > 
  <head> 
    <style type="text/css"> 

.zoomin img {
      height: 200px;
      width: 200px;
      -webkit-transition: all 2s ease;
      -moz-transition: all 2s ease;
      -ms-transition: all 2s ease;
      transition: all 2s ease;
      }

      .zoomin img:hover {
        width: 300px;
        height: 300px;
      }
    </style> 
  </head> 
  <body> 
    <div class="zoomin"> 
      <img src="img/image.png" /> 
    </div> 
  </body> 
</html>

希望对你有帮助

关于css - 如何使用 CSS3 为箭头设置动画,使其看起来像是在增长?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38968178/

相关文章:

jquery - 奇怪的 JS 警告

css - float :right property on <p> which is inside a <div> is not working

text - CSS 是否支持 "crisp, sharp etc"等文本抗锯齿?

html - 单击 anchor 标记时更改选择选项

html - 具有自动宽度中心列的三列布局

html - 如何让我的 div 彼此对齐?

html - 我怎样才能制作 3 个独立的可滚动列

javascript - 巧妙地调整使用 Bootstrap 网格类的元素的大小

html - 由于 li 填充,Chrome 和 Opera 在顶部留下了空白空间