CSS Hover 在網頁設計中是極為常用的一個 CSS 效果，只要你有創造力，都可以讓 Hover 變得更多姿多彩，今天我們主要分享40多款使用 CSS HOVER 完成的圖像效果，喜歡的可以下載下來使用哦。
使用教程
該樣式目前擁有40多種，使用也十分簡單，參照下面的步驟制作即可。Step 1: 引入CSS樣式表文件
<head> <link rel=”stylesheet” href=”css/imagehover.min.css”></head> |
Step 2: 參照下面的HTML結構
<figure class=”imghvr-fade”> <img src=”#”> <figcaption> // Hover 內容 </figcaption></figure> |
其中imghvr-fade就是對應的 CSS hover 效果，這個 Class 名稱可以到演示頁獲得。
打開 CSS 文件，把以下代碼修改自定的顏色值即可。
[class^=’imghvr-‘],[class*=’ imghvr-‘] { background-color: #D14233;} |
當然，如果你只想單獨修改某一個，那么在 HTML 文件下，直接加入 style 樣式，或單獨寫一個 class。
<figure class=”imghvr-fade” style=”background-color:#D14233;”> <img src=”#”> <figcaption> // Hover Content </figcaption></figure> |
兼容性
Imagehover.css 在很大程度上依賴 CSS3特色，包括偽元素、動畫、過渡等等，所以一般支持 CSS3 的瀏覽器都可以兼容。
新聞熱點
疑難解答
