Hover

　　CSS3动力悬停效果的集合，适用于链接，按钮，徽标，SVG，特色图像等。轻松应用于您自己的元素，修改或仅用于灵感。提供CSS，Sass和LESS。

　　安装

　　NPM: npm install hover.css --saveBower: bower install hover --saveDownload Zip如何使用

　　Hover.css可以以多种方式使用; 复制并粘贴您想要在自己的样式表中使用的效果或引用样式表。然后只需将效果的类名添加到您想要应用的元素中。

　　复制并粘贴效果

　　如果您只计划使用一个或多个效果，最好将效果复制并粘贴到您自己的样式表中，这样用户就不必css/hover.css完整下载。

　　假设你想使用Grow效果：

　　下载Hover.css在css/hover.css，找到Grow CSS（每个效果使用上面的注释命名）：/* Grow */.hvr-grow { display: inline-block; vertical-align: middle; transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; transition-duration: 0.3s; transition-property: transform;}.hvr-grow:hover,.hvr-grow:focus,.hvr-grow:active { transform: scale(1.1);}3.复制此效果，然后将其粘贴到您自己的样式表中。

　　4.在您希望显示效果的HTML文件中，将类添加.hvr-grow到您选择的元素中。

　　Example element before applying Hover.css effect:

　　<a href="#">Add to Basket</a>Example element after applying Hover.css effect:

　　<a href="#" class="hvr-grow">Add to Basket</a>关于 display 的说明

　　为了使元素“可转换”，Hover.css为它应用的所有元素提供以下内容：

　　display：inline-block ;vertical-align：middle;如果您希望覆盖此行为，请从Hover.css中删除上述CSS或更改display该元素的属性。请务必在Hover.css声明后声明覆盖，以便CSS级联生效。或者，如果您使用的是Sass / LESS版本的Hover.css，则可以删除/注释掉forceBlockLevel()在scss/_hacks.scss或中找到的mixin less/_hacks.less。

　　有关可转换元素的更多信息，请参阅CSS转换模块。

　　使用图标效果

　　要添加Hover.css图标，请将图标HTML放在应用Hover.css效果的元素内。例如：

　　<a href="#" class="hvr-icon-forward"> Icon Forward <i class="fa fa-chevron-circle-right hvr-icon"></i></a>该项目包含以下文件夹和文件：

　　CSS

　　demo-page.css - 包含演示悬停的样式。您的项目不需要hover-min.css - Hover.css的缩小/生产版本hover.css - Hover.css的开发版本SCSS /更少

　　effects - 包含分类到分类文件夹中的每个单独效果_hacks.scss / _hacks.less,_mixins.scss / _mixins.less,_options.scss / _options.less - Sass / LESS Utilitieshover.scss / hover.less - Sass和LESS风格的Hover.css开发版本浏览器

　　许多Hover.css效果依赖于CSS3功能，例如转换，动画，变换和伪元素，因此，效果可能无法在旧版浏览器中完全发挥作用。

　　过渡和动画 - Internet Explorer 10下不转换 - Internet Explorer 9下不生成的内容（伪元素） - Internet Explorer 8下不除了上面提到的浏览器，所有主流浏览器都Hover.css。请参阅caniuse.com以获得对许多Web技术的完全并相应地测试您的网页。建议使用这些浏览器的CSS或者诸如Modernizr之类的功能测试库，为旧版浏览器应用后备效果。

　　更多使用方法可以查看官方文档

　　开源地址：

　　由于头条审核网址比较严，防止他们误会是推广，所以大家可以自行搜索下载

　　也可以我的头条号后给我发送 `Hover`，会自动把下载地址发送给你（做了关键字自动回复）

　　更多更优质的资讯，请我，你的会鼓励我不断分享更多更好的优质文章。