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特性绘制简易版围棋效果
Sep 28 HTML / CSS
css3背景_动力节点Java学院整理
Jul 11 HTML / CSS
CSS3中Animation动画属性用法详解
Jul 04 HTML / CSS
CSS3实现彩色进度条动画的示例
Oct 29 HTML / CSS
HTML5 Plus 实现手机APP拍照或相册选择图片上传功能
Jul 13 HTML / CSS
html5自带表单验证体验优化及提示气泡修改功能
Sep 12 HTML / CSS
HTML5 本地存储实现购物车功能
Sep 07 HTML / CSS
举例详解HTML5中使用JSON格式提交表单
Jun 16 HTML / CSS
HTML5制作表格样式
Nov 15 HTML / CSS
小程序canvas中文字设置居中锚点
Apr 16 HTML / CSS
Bootstrap File Input文件上传组件
Dec 01 HTML / CSS
CSS Transition通过改变Height实现展开收起元素
Aug 07 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中将汉字转换成拼音的函数代码
2012/09/08 PHP
PHP怎么实现网站保存快捷方式方便用户随时浏览
2013/08/15 PHP
PHP生成自适应大小的缩略图类及使用方法分享
2014/05/06 PHP
php实现的顺序线性表示例
2019/05/04 PHP
个人总结的一些关于String、Function、Array的属性和用法
2007/01/10 Javascript
Prototype 学习 工具函数学习($A方法)
2009/07/12 Javascript
javascript动态加载三
2012/08/22 Javascript
jquery简单瀑布流实现原理及ie8下测试代码
2013/01/23 Javascript
js取消单选按钮选中并判断对象是否为空
2013/11/14 Javascript
JS建造者模式基本用法实例分析
2015/06/30 Javascript
使用Javascript实现选择下拉菜单互移并排序
2016/02/23 Javascript
Javascript学习之谈谈JS的全局变量跟局部变量(推荐)
2016/08/28 Javascript
如何快速上手Vuex
2017/02/14 Javascript
jQuery中animate()的使用方法及解决$(”body“).animate({“scrollTop”:top})不被Firefox支持的问题
2017/04/04 jQuery
详解JavaScript调用栈、尾递归和手动优化
2017/06/03 Javascript
以BootStrap Tab为例写一个前端组件
2017/07/25 Javascript
javascript流程控制语句集合
2017/09/18 Javascript
Bootstrap modal只加载一次数据的解决办法(推荐)
2017/11/24 Javascript
vue实现商城上货组件简易版
2017/11/27 Javascript
利用jqprint插件打印页面内容的实现方法
2018/01/09 Javascript
[51:32]Optic vs Serenity 2018国际邀请赛淘汰赛BO3 第一场 8.22
2018/08/23 DOTA
Python简单实现TCP包发送十六进制数据的方法
2016/04/16 Python
python 与服务器的共享文件夹交互方法
2018/12/27 Python
python 判断linux进程,并杀死进程的实现方法
2019/07/01 Python
Django Admin中增加导出CSV功能过程解析
2019/09/04 Python
PyCharm2019安装教程及其使用(图文教程)
2019/09/29 Python
Python如何使用PIL Image制作GIF图片
2020/05/16 Python
Django model.py表单设置默认值允许为空的操作
2020/05/19 Python
HTML5中的Web Notification桌面右下角通知功能的实现
2018/04/19 HTML / CSS
美国性感女装网站:bebe
2017/03/04 全球购物
世界上最大的乐器零售商:Guitar Center
2017/11/07 全球购物
教师队伍管理制度
2014/01/14 职场文书
詹天佑教学反思
2014/04/30 职场文书
关于感恩的素材句子(38句)
2019/11/11 职场文书
读《皮囊》有感:理解是对他人的最大的善举
2019/11/14 职场文书
Django中的JWT身份验证的实现
2021/05/07 Python