45个非常奇妙的CSS3 特性应用示例


Posted in HTML / CSS onJanuary 01, 2012

这篇文字收集了45个让人觉得不可思议的 CSS3 应用示例,它们验证了 CSS3 Transform 和 Transition 等属性的强大能力。随着越来越多的浏览器对 CSS3 支持的不断完善,设计师和开发者们有了更多的选择,以前需要使用 JavaScript 才能实现的各种很酷的界面效果和动画,如今使用纯 CSS 代码就可以很容易实现。

CSS3 Clock With jQuery

45个非常奇妙的CSS3 特性应用示例

Another Image Gallery

45个非常奇妙的CSS3 特性应用示例

Sliding Vinyl

45个非常奇妙的CSS3 特性应用示例

3D Cube That Rotates Using Arrow Keys

45个非常奇妙的CSS3 特性应用示例

Multiple 3D Cubes (Slide In/Out)

45个非常奇妙的CSS3 特性应用示例

CSS3 Accordion

45个非常奇妙的CSS3 特性应用示例

Auto-Scrolling Parallax

45个非常奇妙的CSS3 特性应用示例

Isocube

45个非常奇妙的CSS3 特性应用示例

Image Gallery

45个非常奇妙的CSS3 特性应用示例

Matrix

45个非常奇妙的CSS3 特性应用示例

7 Javascript-effect Alternatives Using CSS3

45个非常奇妙的CSS3 特性应用示例

Image Hover Effects

45个非常奇妙的CSS3 特性应用示例

Turning Coke Can (Control With Scrollbar)

45个非常奇妙的CSS3 特性应用示例

3D Meninas

45个非常奇妙的CSS3 特性应用示例

Polaroid Gallery

45个非常奇妙的CSS3 特性应用示例

Space

Note: this one is graphic intense and takes a while to load, but the result is crazy!

45个非常奇妙的CSS3 特性应用示例

Mac Dock

45个非常奇妙的CSS3 特性应用示例

Drop-In Modals

45个非常奇妙的CSS3 特性应用示例

Zooming Polaroids

45个非常奇妙的CSS3 特性应用示例

Animated Rocket

45个非常奇妙的CSS3 特性应用示例

Poster Circle

45个非常奇妙的CSS3 特性应用示例

Morphing Cubes

45个非常奇妙的CSS3 特性应用示例

Analogue Clock

45个非常奇妙的CSS3 特性应用示例

Falling Leaves

45个非常奇妙的CSS3 特性应用示例

Animated Polaroid Gallery

45个非常奇妙的CSS3 特性应用示例

Spotlight Cast Shadow

45个非常奇妙的CSS3 特性应用示例

Colorful Clock

45个非常奇妙的CSS3 特性应用示例

Lightbox Gallery (Draggable)

45个非常奇妙的CSS3 特性应用示例

Elastic Thumbnail Menu

45个非常奇妙的CSS3 特性应用示例

Coverflow

45个非常奇妙的CSS3 特性应用示例

Snowflakes

45个非常奇妙的CSS3 特性应用示例

jQuery DJ Hero

45个非常奇妙的CSS3 特性应用示例

Dynamic Stacking Cards

45个非常奇妙的CSS3 特性应用示例

Snow Stack (Control With Arrow Keys)

45个非常奇妙的CSS3 特性应用示例

Animated Pricing Column

45个非常奇妙的CSS3 特性应用示例

Slick jQuery Menu

45个非常奇妙的CSS3 特性应用示例

CSS3

45个非常奇妙的CSS3 特性应用示例

CSS Tabs Without Javascript

45个非常奇妙的CSS3 特性应用示例

Tab Menus Without Javascript

45个非常奇妙的CSS3 特性应用示例

SVG Fisheye Menu

45个非常奇妙的CSS3 特性应用示例

Dynamic Presentation Without Flash

45个非常奇妙的CSS3 特性应用示例

Rotating Gallery

45个非常奇妙的CSS3 特性应用示例

Dropdown Menu

45个非常奇妙的CSS3 特性应用示例

Frame-by-Frame Animation (Hover to Play)

45个非常奇妙的CSS3 特性应用示例

Another Accordion

45个非常奇妙的CSS3 特性应用示例

AT-AT Walker (No Flash or Javascript)

45个非常奇妙的CSS3 特性应用示例

Another Fisheye

45个非常奇妙的CSS3 特性应用示例

HTML / CSS 相关文章推荐
使用css3和jquery实现可伸缩搜索框
Feb 12 HTML / CSS
使用CSS3中的calc()属性来以算式表达尺寸数值
Jun 06 HTML / CSS
详解CSS 3 中的 calc() 方法
Jan 12 HTML / CSS
Html5如何唤起百度地图App的方法
Jan 27 HTML / CSS
html5 Canvas画图教程(2)—画直线与设置线条的样式如颜色/端点/交汇点
Jan 09 HTML / CSS
HTML5 Canvas如何实现纹理填充与描边(Fill And Stroke)
Jul 15 HTML / CSS
使用HTML5 Canvas API控制字体的显示与渲染的方法
Mar 24 HTML / CSS
浅析HTML5中header标签的用法
Jun 24 HTML / CSS
localStorage、sessionStorage使用总结
Nov 17 HTML / CSS
详解html5 canvas 微信海报分享(个人爬坑)
Jan 12 HTML / CSS
recorder.js 基于Html5录音功能的实现
May 26 HTML / CSS
详解CSS不受控制的position fixed
May 25 HTML / CSS
让IE6支持css3,让 IE7、IE8 都支持CSS3
Oct 09 #HTML / CSS
利用CSS3的transform做的动态时钟效果
Sep 21 #HTML / CSS
CSS3 border-image详解、应用及jQuery插件
Aug 29 #HTML / CSS
CSS3 特效范例整理
Aug 22 #HTML / CSS
你正在寻找的CSS3 动画技术
Jul 27 #HTML / CSS
IE兼容css3圆角的实现代码
Jul 21 #HTML / CSS
10个很棒的 CSS3 开发工具 推荐
May 16 #HTML / CSS
You might like
php使用curl抓取qq空间的访客信息示例
2014/02/28 PHP
php插件Xajax使用方法详解
2017/08/31 PHP
Ajax+Jpgraph实现的动态折线图功能示例
2019/02/11 PHP
Yii框架日志操作图文与实例详解
2019/09/09 PHP
不错的JS中变量相关的细节分析
2007/08/13 Javascript
ext监听事件方法[初级篇]
2008/04/27 Javascript
IE Firefox 使用自定义标签的区别
2009/10/15 Javascript
Jquery遍历节点的方法小集
2014/01/22 Javascript
常见的javascript跨域通信方法
2015/12/31 Javascript
在JavaScript中调用Java类和接口的方法
2016/09/07 Javascript
使用原生的javascript来实现轮播图
2017/02/24 Javascript
js获取一组日期中最近连续的天数
2017/05/25 Javascript
AngularJS通过ng-Img-Crop实现头像截取的示例
2017/08/17 Javascript
vue使用element-ui的el-input监听不了回车事件的解决方法
2018/01/12 Javascript
基于vue-cli 路由 实现类似tab切换效果(vue 2.0)
2019/05/08 Javascript
小程序实现左滑删除效果
2019/07/25 Javascript
深入理解令牌认证机制(token)
2019/08/22 Javascript
layui实现form表单同时提交数据和文件的代码
2019/10/25 Javascript
VSCode Vue开发推荐插件和VSCode快捷键(小结)
2020/08/08 Javascript
微信小程序picker组件两列关联使用方式
2020/10/27 Javascript
python 实现堆排序算法代码
2012/06/05 Python
Python实现复杂对象转JSON的方法示例
2017/06/22 Python
对python pandas 画移动平均线的方法详解
2018/11/28 Python
Python QQBot库的QQ聊天机器人
2019/06/19 Python
python文字和unicode/ascll相互转换函数及简单加密解密实现代码
2019/08/12 Python
Python模块的制作方法实例分析
2019/12/21 Python
如何在Django中使用聚合的实现示例
2020/03/23 Python
Pandas对DataFrame单列/多列进行运算(map, apply, transform, agg)
2020/06/14 Python
python 调用API接口 获取和解析 Json数据
2020/09/28 Python
新驾驶员个人自我评价
2014/01/03 职场文书
优质服务演讲稿
2014/05/14 职场文书
开学典礼策划方案
2014/05/28 职场文书
2014年幼儿园老师工作总结
2014/12/05 职场文书
2014年控辍保学工作总结
2014/12/08 职场文书
python turtle绘制多边形和跳跃和改变速度特效
2022/03/16 Python
Redis特殊数据类型HyperLogLog基数统计算法讲解
2022/06/01 Redis