PHP程序员站--PHP编程开发平台
 当前位置:主页 >> 网页制作 >> CSS >> 

21 个新鲜的 CSS 3 教程与技巧

21 个新鲜的 CSS 3 教程与技巧

来源:PHP程序员站  作者:PHP程序员站  发布时间:2011-05-28
CSS3 已经变得很流行。大部分的浏览器比如IE7、IE8、Safari、Firefox和Chrome,都支持新的CSS3属性。CSS3有非常多的web和移动方面的功能。 本文列出21个新鲜的CSS3教程和技巧,供大家学习、交流。 1. iPhone slide to unlock Text in WebKit/CSS3 iPhone的滑动解锁的文

11.Animated Sprites with CSS3 Transitions

CSS3 动画,准确的说,CSS3转换,不需要JavaScript。

css3-1

View Live Demo

12.CSS3 Flying Menu

CSS3按钮效果。

css3-13

View Live Demo

13.Popout Details on Hover w/ CSS

弹出效果,非常不错,很容易被实现。

css3-14

View Live Demo

14.HTML5 & CSS3 readiness

css3-15

View Live Demo

15.CSS3 Button Maker

CSS3,按钮制作,可以通过拖曳等,制作漂亮的CSS,为了你的按钮。

css3-16

View Live Demo

16.Fancy Image Hover Using CSS3

CSS3制作的悬停效果,见下图。这可不是jquery做的哦。

css3-17

View Live Demo

17.Creating A Rocking CSS3 Search Field

CSS3搜索域,该案例涉及到多个CSS3属性css3-23

View Live Demo

 

18.Fading Button Background Images With CSS3 Transitions

这个变换效果,会再次让你以为是用flash制作的。

 

css3-19

 

View Live Demo

19.Super Cool CSS Flip Effect with Webkit Animation

超酷的动画/转换效果。

css3-20

 

View Live Demo

20.Build a HTML5/CSS3 Website Layout without Images

无需图片,创建网站布局。

css3-21

View Live Demo

21.Pure CSS Reflections

看图就知道哦,确保你用的是基于webkit的浏览器。

css3-22

View Live Demo


延伸阅读:
css3.0中文手册
CSS 3 灵活的 Box Model
CSS圆角在CSS2和CSS3里的实现方法
CSS 3 备受期待的八大新功能介绍
用CSS3制作网页下拉菜单代码
CSS3的简单又实用的3个属性
各大浏览器CSS3和HTML5兼容速查表
CSS3常见的开发工具收集整理
FLASH的终结者 47个惊人的CSS3动画演示
css3.0新属性效果在ie下的解决方案
CSS3属性box-shadow实现阴影效果教程


css3中圆角和阴影的实验
CSS3 Media Queries 详解
令人难以置信的纯 CSS3 图标欣赏
css3:background属性调整增强
让IE支持CSS3圆角的方法
2011年Web设计趋势:CSS3+HTML5居首位
12组免费的CSS3按钮强力推荐
推荐12个漂亮的CSS3按钮实现方案
3款新鲜的CSS3&HTML5框架
Tags: css3   教程   技巧  
最新文章
推荐阅读
月点击排行榜
PHP程序员站 Copyright © 2007-2010,PHPERZ.COM All Rights Reserved 粤ICP备07503606号