标签归档:CSS3按钮

CSS3小球浮动按钮 小球滚动很逼真

今天要分享一款很有特色的CSS3动画按钮,它和普通的按钮不同,外观也不像普通的按钮,这款按钮由7个点组成,每点击其中一个小点按钮,小球即会滚动到相应的位置,小球有投影,滚动效果也非常逼真。更多按钮特效,可以移步至CSS3按钮目录。

css3-float-button

在线演示源码下载

CSS3多样式小图标按钮 带分享按钮

今天我们要来分享一款样式非常丰富的CSS3按钮特效,这些按钮的外观有点仿谷歌的风格,而且每一个按钮带有个性的小图标。另外按钮有一个特点,还可以定制出不错的分享按钮。之前我们也分享过不少漂亮的CSS3按钮,大家可以在CSS3按钮目录下查看。

css3-button-with-icons

在线演示源码下载

纯CSS3实现滑杆开关切换按钮动画

之前我们分享过一些CSS3开关切换按钮了,像这款CSS3 3D发光切换按钮HTML5/CSS3开关按钮 立体3D按钮等。今天我们要再来分享一款纯CSS3实现滑杆开关切换按钮动画,这个按钮是一个摇杆,杆子推上推下来切换开关状态,不同的开关状态也有不同颜色的指示灯。

css3-stick-switch

在线演示源码下载

纯CSS3背景渐变按钮 按钮图标淡入淡出动画

今天我们要再来分享一款纯CSS3实现的按钮动画,这款按钮动画有以下特点:当鼠标滑过按钮时,按钮上的小图标便会以爆炸的方式淡出按钮,取代它的时相应的文字,当鼠标离开按钮时,小图标又会以爆炸的方式淡入按钮中。更多CSS3按钮,我们可以在CSS3按钮栏目中查找。

css3-icon-animation-button

在线演示源码下载

CSS3/SVG质感背景小图标 镂空效果图标按钮

之前我们分享过很多利用CSS3制作的图标小按钮,比如一些分享按钮,如纯CSS3社会化分享按钮,还有一些带小图标的CSS3菜单,如HTML5/CSS3滑块动画菜单 图标动画很酷。今天我们来分享一款用CSS3和SVG实现的质感背景小图标,鼠标滑过图标时出现镂空的效果,并且有质感背景的描边,效果非常不错。

svg-icons-with-patterns

在线演示源码下载

CSS3 3D发光切换按钮 模拟效果很逼真

刚刚我们发布过一款CSS3开关切换滑动按钮,应该说出了有点3D立体的效果外,其他都很普通。现在我们要来分享一款更酷的CSS3开关切换按钮,它不仅具有3D的效果,而且可以发光,当开关处于打开状态时,旁边的小灯就会亮起来,然后灯光投射到开关上,效果挺逼真的。

css3-shine-switch-button

在线演示源码下载

CSS3开关切换按钮 可左右横向切换

之前我们分享过不少效果很酷的CSS3开关切换按钮,像这款CSS3 3D弹性按钮效果非常有质感,还有像这款CSS3 3D发光按钮又非常绚丽。今天我们要分享一款可左右滑动的CSS3开关按钮,鼠标点击按钮即可实现ios的滑块按钮效果。

css3-switch-light-button

在线演示源码下载

HTML5/CSS3鼠标滑过抖动图标 非常可爱

这是一款简单的利用CSS3实现的图标抖动特效,首先我们精选了几款常用而且漂亮的图标,并在图标下方写有描述性的文字。当我们把鼠标滑过图标时,图标即会不停的抖动,像是在告诉用户“点我吧”,这个功能很多地方应该能用到。

html5-css3-swing-icon

在线演示源码下载

CSS3各大网站分享按钮 带网站Logo小图标

对于CSS3分享按钮,我们在之前的文章中已经分享几款了,像纯CSS3社会化分享按钮 可固定网页顶部CSS3发光社会分享按钮等。今天我又收集了一款非常强大的CSS3各大网站分享按钮,非常多的按钮,基本上一些国外的社交网站都有。另外,这款CSS3分享按钮还带有社交网站的Logo小图标,外观非常漂亮。

css3-share-button-logo-icon

在线演示源码下载

CSS3 3D弹性按钮效果 带弹性质感

之前我们分享过一款非常酷的纯CSS3 3D按钮 按钮酷似牛奶般剔透,这款按钮的特点有二:牛奶般的立体外观,按钮按下时非常柔和的弹性效果。今天要分享的这款CSS3按钮和这款按钮差不错,也同样拥有3D的效果,按钮在按下时带有弹性质感。

css3-3d-reakustuc-button

在线演示源码下载