标签归档:CSS3按钮

CSS3仿Android按钮点击波浪特效

今天我们要来分享一个非常炫酷的CSS3按钮特效,它主要是模仿了Android系统中的按钮点击波浪动画特效,可以点击菜单链接、按钮这些网页元素,点击按钮后会出现波浪发光的动画效果,确实是一款既实用又炫酷的CSS3应用。

css3-ripple-button

在线演示源码下载

纯CSS3鼠标滑过按钮动画 多种动画风格

今天要分享一款基于纯CSS3实现的鼠标滑过按钮动画,一共有5组动画风格。和之前分享的CSS3按钮发光动画相比,这款按钮动画更为有质地,而且也更实用。这5款风格的按钮动画,有发光的特效,也有3D立体的效果,你可以选择一款适合你的按钮应用在网页中。

pure-css3-button-animation

在线演示源码下载

CSS3前后翻页按钮 清新3D外观

之前我们也介绍过不少CSS3按钮了,也有不少是基于HTML5的,比如8个时尚而简约的HTML5按钮这篇文章中就有不少经典的按钮插件。这次我们要分享的也是一款CSS3按钮,它的特点是支持前后翻页的样式,按钮边框有一层淡淡的阴影,因此整体呈现清新的3D外观。

css3-3d-pre-next-buttons

HTML代码:

<div>
	<a class="button back" href="javascript:void(0)">Back</a>
	<a class="button next" href="javascript:void(0)">Next</a>
</div>

<div>
	<a class="button back" href="javascript:void(0)">Previous Slide</a>
	<a class="button next" href="javascript:void(0)">Next Slide</a>
</div&g[......]

阅读全文>>

HTML5/CSS3鼠标悬停动画菜单按钮

之前我们已经向大家分享过很多炫酷的HTML5/CSS3菜单,包括多级下拉菜单、动画菜单等。今天要给给位分享一款基于CSS3的鼠标悬停动画菜单按钮,这款菜单是由一个个小按钮组成,当我们将鼠标滑过菜单项时,按钮上的图标将出现悬浮的动画特效。

css3-hover-icon-menu

在线演示源码下载

CSS3鼠标悬停动画按钮集合

之前我们介绍过不少炫酷而实用的CSS3按钮,比如像这款纯CSS3实现质感发光动画按钮的动画效果就非常漂亮。这次要分享的也是一款不错的CSS3动画按钮,当我们将鼠标滑过按钮时,按钮会展现不同方式的动画效果,大家可以具体看看演示。

css3-hover-button-animation

在线演示源码下载

漂亮的CSS3圆角按钮组合

之前我们已经为大家分享过很多绚丽的CSS3按钮了,比如这款纯CSS3实现质感发光动画按钮和去年发布的HTML5/CSS3一组可爱的3D按钮。今天要分享的是一款CSS3圆角按钮,这组按钮有不同的颜色主题,利用CSS3特性实现了圆角效果,看上去还相当不错。

pure-css3-rounded-button

在线演示源码下载

纯CSS3实现质感发光动画按钮

之前我们分享过很多漂亮的网页按钮动画,大家可以移步至CSS3按钮分类下查看各种各样的CSS3按钮。这次要分享的这款CSS3按钮有着质感的背景,并且鼠标滑过按钮时按钮边框还会发光,呈现出3D立体的视觉效果。

pure-css3-texture-shine-button

在线演示源码下载

CSS3音量调节旋转按钮

之前我们分享过很多可以调节音量的HTML5视频播放器,大部分音量调节按钮都比较普通,没有什么特色。今天要分享一款基于CSS3的音量调节旋转按钮,只要按住鼠标即可旋转按钮来调节音量。这是一款很有特色旋转按钮。

css3-rotate-buttons

在线演示源码下载

CSS3创意开关切换按钮

今天我们要来分享一款非常有创意的CSS3开关切换按钮,和之前分享的这款CSS3发光开关按钮类似,它也具有点击后按钮切换的动画特效,更有特色的是,该按钮在切换过程中其边框会产生扭动的动画特效,看上去非常不错。

css3-toggle-switch-button

在线演示源码下载

CSS3鼠标悬停边框线条动画按钮

今天我们要来分享一款非常有个性的CSS3按钮, 当鼠标滑过按钮时,按钮的边框将会产生线条动画效果。另外,这款CSS3按钮的整体风格比较简易,有扁平化的感觉,因此,这款CSS3线条动画按钮非常适合一些比较个性化的个人博客中。

css3-line-button

在线演示源码下载