CSS3红橙黄绿不同颜色按钮

CSS3红橙黄绿不同颜色按钮

分享一套漂亮的不同背景颜色按钮,鼠标悬浮上面,有过渡延迟发光效果,完全通过css3属性,不依赖jQuery插件。

淘建站为您提供更多_css3_按钮_按钮_过渡,在此特别感谢您对我们的支持与厚爱!

查看演示

演示不了,点击反馈

加入收藏

下载 383 次

打赏作者

觉得不错,可打赏下作者

下载资源

免费共享

特别说明:本站资源来自网友发布分享,仅供学习与参考,请勿用于商业用途,若有侵权请联系删除(272966172@qq.com)。
分类:css3 > 按钮 难易程度:初级

引入按钮样式playground.css

<link href="playground.css" media="all" rel="stylesheet" type="text/css" />

定义不同背景颜色按钮css3过渡效果

.green.button{-webkit-animation-name: greenPulse; -webkit-animation-duration: 3s;} .blue.button{-webkit-animation-name: bluePulse; -webkit-animation-duration: 4s;} .red.button{-webkit-animation-name: redPulse; -webkit-animation-duration: 1s;} .magenta.button{-webkit-animation-name: magentaPulse; -webkit-animation-duration: 2s;} .orange.button{-webkit-animation-name: orangePulse; -webkit-animation-duration: 3s;} .orangellow.button{-webkit-animation-name: orangellowPulse; -webkit-animation-duration: 5s;}

HTML

Look at me! Click me! Hi ho, Silver! Look at me! I'm Glowing! Hi ho, Silver!

声明:本资料由淘建站会员提供,如转载注明来源,资料来源淘建站免费素材库:https://www.taojz.cn/texiao/438.html
CSS3红橙黄绿不同颜色按钮 希望对你有帮助,感谢您的支持!
  • 纯CSS3 transition属性鼠标经过酷炫按钮动画特效

    纯CSS3 transition属性鼠标经过酷炫按钮动画特效

  • 多种好看的CSS3鼠标悬停动画按钮集合

    多种好看的CSS3鼠标悬停动画按钮集合

  • html5文字按钮导航波浪动画特效

    html5文字按钮导航波浪动画特效

  • 旋转圆形按钮显示百分比进度条

    旋转圆形按钮显示百分比进度条

  • jQuery悬浮图片上13种超炫效果

    jQuery悬浮图片上13种超炫效果

  • jQuery+Background+Animation背景过渡插件

    jQuery+Background+Animation背景过渡插件

  • 可设置信息,皮肤,确定按钮文字,回调事件的提示框插件

    可设置信息,皮肤,确定按钮文字,回调事件的提示框插件

  • jQuery input按钮设置数字增加减少代码

    jQuery input按钮设置数字增加减少代码

  • jquery步骤进度条按钮控制步骤进度条代码

    jquery步骤进度条按钮控制步骤进度条代码

  • jquery简单的点击按钮弹出窗口动画效果

    jquery简单的点击按钮弹出窗口动画效果

  • jQuery css3带缩略图按钮控制图片淡出淡进效果

    jQuery css3带缩略图按钮控制图片淡出淡进效果

  • jquery文字滚动插件带按钮控制文字上下滚动代码

    jquery文字滚动插件带按钮控制文字上下滚动代码

  • 留言(0)
    头像
     阿里云限量代金券,戳我领取
    1 2