使用 CSS3 可以实现的五种很酷很炫的效果

  

CSS3 给 Web 开发带来了革命性的影响，以前很多需要 JavaScript 才能实现的复杂效果，现在使用 CSS3 就能简单的实现。如果你想了解 CSS3 可以做些什么的话，可以参考本文列出的 CSS3 能实现的很炫的应用。这些很酷的例子中有渐变、旋转、字体效果以及三维变换等等，尽情欣赏吧。
1.制作精美的按钮

BonBon

zardi

alexwhinfield

 

webdesignerwall

 

http://net.tutsplus.com

 

nimbupani 

fortysevenmedia

 2.实现很很酷的字体效果

http://lab.simurai.com/css/iloveblur/

 

http://markdotto.com/playground/3d-text/

  http://blog.echoenduring.com/2010/05/13/create-beautiful-css3-typography/

 

http://www.reynoldsftw.com/2009/03/text-embossing-technique-with-css/

  http://line25.com/tutorials/create-a-letterpress-effect-with-css-text-shadow

 

http://trentwalton.com/css3/type/

  http://neography.com/experiment/type1/

  http://net.tutsplus.com/tutorials/html-css-techniques/subtle-css3-typography-that-youd-swear-was-made-in-photoshop/

  http://desandro.com/articles/the-new-lens-flare/

  http://lab.simurai.com/css/carveme/

 

3.创建时尚表单

http://webexpedition18.com/articles/how-to-create-a-multi-step-signup-form-with-css3-and-jquery/

  http://net.tutsplus.com/tutorials/html-css-techniques/design-a-prettier-web-form-with-css-3/

  http://webdesignerwall.com/tutorials/beautiful-css3-search-form

  http://www.vooshthemes.com/blog/design-tutorial/create-a-clean-and-stylish-css3-contact-form/

 
http://www.wearepixel8.com/blog/style-form-using-css3/

  http://www.threestyles.com/tutorials/css3-login-form-tutorial/

 

4.制作漂亮的导航菜单

http://net.tutsplus.com/tutorials/html-css-techniques/how-to-build-a-kick-butt-css3-mega-drop-down-menu/

 

http://blog.insicdesigns.com/2010/02/create-a-slick-menu-using-css3/

  http://blog.insicdesigns.com/2010/02/creating-a-fancy-menu-using-css3-and-jquery/

  http://addyosmani.com/blog/formbox/

  http://webdesignerwall.com/tutorials/css3-dropdown-menu

 
5.28个很炫的css3实例及实验

http://onotakehiko.com/webkitclock/#sydney

  http://www.codeforest.net/recreating-tumblr%E2%80%99s-%E2%80%9Cupdating-%E2%80%9D-page-using-pure-css3-with-fallbacks-for-older-browsers

  http://www.marcofolio.net/css/rotating_billboard_using_only_css3.html

  http://www.bene.be/blog/comments/making_labels_with_css3/

  http://acrisdesign.com/2010/08/create-animated-landscape-using-pure-css3/

  http://www.zurb.com/playground/sliding-vinyl

  http://www.codeforest.net/be-hypnotized-with-css3-creating-an-animated-css3-spiral

  http://matthewjamestaylor.com/blog/css3-starbursts

  http://media.miekd.com/css3memory/

  http://www.zurb.com/playground/css3-polaroids

  http://trentwalton.com/css3/connecting_the_dots/

  http://rathersplendid.net/home/pure-css-icons

  http://gordonbrander.com/lab/css3-stacks/#stack

  http://www.zurb.com/playground/drop-in-modals

  http://www.marcofolio.net/css/wicked_css3_3d_bar_chart.html

  http://maxvoltar.com/sandbox/flipclock/

  http://media.smashingmagazine.com/cdn_smash/wp-content/uploads/uploader/images/css3-designs/css3-charts/index.html

  http://dev.ajcates.com/tests/wrap-shadow/test.php

  http://m.madebycanvas.com/#show-signup

  http://lab.simurai.com/ui/zen-player/

  http://lab.simurai.com/css/toggle/#box

http://matthamm.com/box-shadow-curl.html

  http://www.zurb.com/playground/css-boxshadow-experiments

  http://michaelhue.com/cssdock/

 

http://www.is-real.net/experiments/css3/wonder-webkit/

 

http://sadmac.info/css3/

 http://dl.dropbox.com/u/921159/Keyboard/page.html

 

相关阅读
24款非常实用的CSS3工具终极收藏
11个非常棒的CSS3实现的图片画廊
使用CSS3 @font-face实现个性化字体