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

您可能感兴趣的相关文章

立即下载      在线演示

您可能感兴趣的相关文章

本文链接：Hover.css：一组超实用的 CSS3 悬停效果

编译来源：梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源

Hover.css：一组超实用的 CSS3 悬停效果和动画的更多相关文章

  1. css3 3d效果及动画学习

    css参考手册: http://www.phpstudy.net/css3/ http://www.css88.com/book/css/ 呈现3d效果:-webkit-transform-style ...

  2. CSS3悬停特效合集Hover.css

    CSS3悬停特效合集Hover.css是一款特效丰富,支持2D变化特效.边框特效.阴影特效等: 使用简单,可直接复制相关特效代码,快速应用到元素上. 源码地址:http://www.huiyi8.co ...

  3. HTML+CSS鼠标悬停效果

    HTML+CSS实现鼠标悬停效果 HTML: <link href="style.css" rel="stylesheet"> <a clas ...

  4. 用Less CSS定义常用的CSS3效果函数

    定义圆角及调用 /* 定义圆角 @radius 圆角大小 */ .round(@radius:5px){ border-radius:@radius; -webkit-border-radius: @ ...

  5. 前端每日实战：126# 视频演示如何用纯 CSS 创作小球变矩形背景的按钮悬停效果

    效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/yxbEzJ 可交互视频 此视频是可 ...

  6. chrome DevTools 里面 css样式里面 勾上 :hover 会将鼠标移上的效果一直保持，技巧：要在鼠标上的 div上 勾 :hover

    chrome DevTools 里面 css样式里面 勾上 :hover 会将鼠标移上的效果一直保持,技巧:要在鼠标上的 div上 勾 :hover

  7. css 马赛克悬停效果

    css 马赛克悬停效果 <!DOCTYPE html> <html lang="en"> <head> <meta charset=

  8. 【超酷超实用】CSS3可滑动跳转的分页插件制作教程

    原文:[超酷超实用]CSS3可滑动跳转的分页插件制作教程 今天我要向大家分享一款很特别的CSS3分页插件,这款分页插件不仅可以点击分页按钮来实现分页,而且可以滑动滑杆来实现任意页面的跳转,看看都非常酷 ...

  9. css3 3D效果

    css3 3D变形 transfrom初学 这个礼拜学了css3 3d,感觉到css无穷的魅力,可以通过几个特定的代码符号创建出3D效果的页面. ___ 透视 一个元素需要一个透视点才能激活3D空间, ...

随机推荐

  1. 《理解 ES6》阅读整理：函数（Functions）（六）Purpose of Functions

    明确函数的双重作用(Clarifying the Dual Purpose of Functions) 在ES5及更早的ES版本中,函数调用时是否使用new会有不同的作用.当使用new时,函数内的th ...

  2. 搭建 SubversionEdge for VS

    1. 需要软件 SubversionEdge , AnkhSvn,TortoiseSVN: 2. 安装3个软件,一路Next 3. 安装完SubversionEdge 后,会打开一个网页http:// ...

  3. 打造Ubuntu下Java开发环境

    一.了解JDK 不同的java软件和类库对jdk有不同要求,在了解如何安装Java之前,让我们快速地了解JRE.OpenJDK和Oracle JDK之间的不同之处. JRE(Java Runtime ...

  4. 巧用JS内置对象Function

    在做练习的时候也好,做项目的时候也好,我经常会碰到想要的到一个字符串“”里面的东西的这样的需求. 注意,“”里面的东西可以是任何东西[],number等等 于是有了个大神教我一个绝招: 于是世界圆满了 ...

  5. js实现快速排序

    非原创: var quickSort = function(arr){ if(arr.length<=1){return arr;} var pivotIndex = Math.floor(ar ...

  6. node访问iis使用keep-alive设置不当

    iis默认的连接超时时间为2分钟 ,因此node程序使用keep-alive访问时,keep-alive的时间不应该超过2分钟,否则在请求完成后,node端继续保持连接,2分钟后iis断开连接,会导致 ...

  7. [MFC] 梳理一个简单的图片处理桌面软件中用到的MFC控件技巧

     前言 前些天应好友之拖,帮忙设计一个简单的图像处理的小软件.朋友把核心算法封装好了,但是是用openCV类似于console的编程环境,要我在此基础上改成MFC桌面程序.下图是做成之后的效果: 我是 ...

  8. 本地DNS安装

    在centOS里最常用的DNS服务工具应该是bind了.下面就以bind为例做一个DNS服务. 首先查看bind 是否已经安装 Rpm -qa | gerp bind 如果没有的话就用yum 安装一下 ...

  9. the bundle at bundle path is not signed using an apple submission certificate

    在app上架的时候,出现这个错误,也许只是你的Apple Worldwide Developer Relations Certification Authority Intermediate Cert ...

  10. js模仿新浪微博限制字数输入

    功能:实现新浪微博输入字数提醒功能:最多输入140个字,当输入字时,上面提示部分字数发生变化,如果字数小于25,字体颜色变红:当可输入字数为0时,强制不能输入,如果用中文输入法 一次性输入很多字,那么 ...