CSS3懸停效果和動畫Hover.css


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》
 
 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2026 CODEPRJ.COM