码迷,mamicode.com
首页 > Web开发 > 详细

CSS3悬停效果和动画Hover.css

时间:2016-04-15 16:42:55      阅读:169      评论:0      收藏:0      [点我收藏+]

标签:

Hover.css 是一套基于 CSS3 的鼠标悬停效果和动画,这些可以非常轻松的被应用到按钮、LOGO 以及图片等元素。所有这些效果都是只需要单一的标签,必要的时候使用 before 和 after 伪元素。因为使用了CSS3过渡、转换和动画效果,因此只支持 Chrome、Firefox 和 Safari 等现代浏览器。

 
使用方法很简单:
下载HOVER.CSS      下载地址https://github.com/IanLunn/Hover
Download/Install
NPM: npm install --save hover.css
Bower: bower install Hover
Download Hover.css
引入.css 文件
link href="css/hover-min.css" rel="stylesheet"》
 
或者
@import url("hover-min.css");
 
直接《a href="#" class="button hvr-grow"》Add to Basket《/a
如果要重写样式,只要调用相应的类,改变想要重写的样式即可,十分的方便 。
 
使用ICON 图标 ,引入
《link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css"rel="stylesheet" media="all"
直接调用icon 类
《a href="#" class="hvr-icon-bounce"》icon-bounce《/a》
 
 

CSS3悬停效果和动画Hover.css

标签:

原文地址:http://www.cnblogs.com/Eplayed/p/5395929.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!