当前位置:  开发笔记 > 前端 > 正文

如何在字体真棒图标中创建过渡效果

如何解决《如何在字体真棒图标中创建过渡效果》经验,为你挑选了1个好方法。

我需要解决这个问题,但它应该是可靠的font-awesome图标.

请帮我.在图标上悬停时轻松创建字体真棒图标过渡效果



1> MorKadosh..:

可以像任何其他CSS转换一样完成Fontawesome转换.您只需要为它们设置具有此过渡效果的属性,并定义"新"值.

例如:

.fa{
     font-size:30px;
     margin:5px;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.fa:hover{
  font-size: 40px;
  transform: rotate(45deg);
}

在此示例中,悬停时图标将增长并将旋转45度.

请在此处阅读有关转换的信息:http://www.w3schools.com/cssref/css3_pr_transform.asp

你可以在这里看到一个实例:http://jsfiddle.net/gn57dkez/

推荐阅读
手机用户2402851155
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有