你可能已经听过很多次了:作为开发者，我们正处于工作方式转变的边缘。引领潮流的是未来的标准，如CSS3和HTML5，它们已经部分实现了5个标准中的4个主要浏览器,IE9承诺支持，赋予我们创造互动性和丰富用户体验的新方法。CSS3到底有多棒?
看看这10个实验和演示，就能找到答案。
1.我们的太阳系
这个实验展示了我们太阳系的行星轨道(当然是快进)，通过使用CSS3的这个特性,变换,动画．此外，将鼠标悬停在右侧每个行星的名称上，会使用CSS显示一个动画工具提示(学习如何使CSS3动画工具提示)．你可以读到这个实验是如何发展起来的这个介绍Alex Girón，这个一流的CSS3演示的创建者。
动画，目前，只适用于WebKit浏览器(谷歌Chrome和Safari)。
2.CSS3广告与Flash广告
Flash动画网页横幅因干扰用户体验而臭名昭著。广告拦截应用程序可以通过查找网页上所有嵌入的Flash对象并隐藏它们来关闭这些功能。然而，使用CSS3动画，这些Flash广告可以在功能上模仿，但很难用第三方软件禁用。
在这个实验中，使用CSS3重新创建了几个广告，结果与flash构造的广告几乎相同。
3.CSS3-Man
这是一个强大的动画序列的灵感蜘蛛侠60年代的动画电视连续剧。使序列工作涉及使用CSS3的变换,@key-frame而且旋转；jQuery用于预加载图像，HTML5用于音频。创作者写了一篇关于CSS3-Man动画序列如何工作的解释，这将让你对这个惊人的实验所涉及的努力程度有一个大致的了解。
4.来自好莱坞的男人
这个演示是一个动画序列(基于动能排版)，探索了一种方法，我们可以取代丰富的动画组件，如Flash或After Effects。这个概念的证明主要利用先进的CSS选择器和CSS3动画，然而，它不是纯粹的CSS，因为JavaScript被用来切换元素类的开关。
5.Anigma
我们经常使用Flash(或Silverlight)制作丰富的交互式网页视频游戏。这个CSS3演示是一个解谜游戏，也是我们如何使用开放标准来创建游戏的概念证明——尽管不可否认，它不像Flash那样简单然而,如果你将其与Kongregate等网站上的Flash游戏进行比较。HTML5的<音频>元素被用来嵌入声音。
6.动画光板
这个演示是堆叠的图像，看起来像宝丽来。悬停在一张照片上，它平稳地过渡到堆栈的前面，为呈现您的图片库提供了一个有趣的互动。演示是通过杠杆制作的过渡,变换，动态伪选择器(动画目标元素)，以及风格属性，如不必为了视觉效果。
读本教程如果你想知道它是如何发展起来的。
7.CSS3音乐播放器菜单
HTML5的<音频>而且< >视频api，它将使我们能够利用多媒体而不依赖于专有插件，我们最终将需要gui，为我们的用户提供对我们所服务的媒体的控制。虽然我们可以将静态图像与其他HTML元素(如按钮)结合使用来构建这些界面，但仅使用HTML和CSS来呈现媒体控件意味着我们将拥有一个更具可塑性的解决方案。这用户界面只使用CSS3构建的音乐播放器(梯度,这个特性,不必诸如此类的好东西)。
阅读关于这是如何构造的解释本教程．
8.滑动乙烯基与CSS3
这个演示，在ZURB开发游乐场，采用黑胶唱片封面，当鼠标悬停在封面上时，会使黑胶唱片滑动出动画，其中包含额外的控制(“更多信息”和“播放”)。这个概念的证明有一天可以作为一个优雅的基于web的网站界面，当与HTML5相结合时可以播放音乐<音频>API。
9.加布里埃尔·夏普的《小行星
这个动画序列描绘了一个快进的昼夜循环。它可以在WebKit浏览器(Safari和Chrome)上使用@keyframesCSS3属性用于移动和转换PNG图像。
10.落叶
WebKit展示了CSS3的功能动画财产与一个壮观的平滑演示落叶。提示:使用浏览器的“查看源代码”功能来阅读演示的源代码——代码有很好的文档说明，其中解释了它是如何工作的。读WebKit的博客关于动画属性来更好地感受所有的可能性。
