24款非常实用的CSS3工具终极收藏

  1. 云栖社区>
  2. 博客>
  3. 正文

24款非常实用的CSS3工具终极收藏

秋天风景 2011-03-09 00:21:00 浏览677
展开阅读全文

您可能还喜欢



  对于Web设计和开发人员来说,CSS是非常重要的一部分,随着越来越多的浏览器对CSS3的支持及不断完善,设计师和开发者们有了更多的选择。如今,用纯CSS就可以实现各种各样很酷的效果,甚至是动画。今天这篇文章向大家推荐24款非常优秀的CSS3工具,为了获得更佳的效果,请在Chrome 4+, Safari 4+, Firefox 3.6+, IE9+, Opera 10.5+版本浏览器中浏览如下在线工具。

1.CSS3 Pie

使用CSS3 Pie可以让IE6至IE8版本实现大多数的CSS3修饰特性,如圆角、阴影、渐变等等。

img_cf665a094b899124b0bf242bf638f0a6.jpg

2. CSS3 Click Chart

非常好的CSS3效果演示,提供了示例代码。

img_5f29e5fe2f5a229decac118f5c780abe.jpg

3.CSS3 Please!

非常帅的一款CSS3工具,可修改代码,即时预览。

img_3049870e96cf1922cdbbd471868e576a.jpg

4.CSS3 Button Maker

一个非常不错的CSS3按钮制作工具。

img_8255ab559739f6855c1c4bf911603c12.jpg

5.CSS3 Generator

非常不错的CSS3代码生成器,带预览效果。

img_4a8a9aa7bd90ba5e4702918df8dd4d78.jpg

6.CSS3 Menu

非常不错的CSS3菜单制作工具。

img_d88b5ac20af0a14de9f6f5c63c7adb0d.jpg

7.CSS3 Gradients

一款非常棒的CSS3渐变效果演示工具。

img_1611f3789801331c5590e3beb88ca385.jpg

8.CSS3 Cheat Sheet

一份不错的CSS3属性速查手册(PDF格式)。

img_c6ea73dcdc1205317d1e34c7a6fd96ed.jpg

9.CSS3 Selector Test

非常不错的CSS3选择器测试工具

img_045e6b8b9a8d412ea2eff279ed1ab9dd.jpg

10.CSS3 Transforms

一款强大的CSS3旋转动画效果演示工具,即时生成代码。

img_a90283e1f5fd2bae5dac1e8ad8a16730.jpg

11.CSS3 Preview

CSS3特性介绍及效果预览。

img_989ed2bd0843965a150566ae7fa6809b.jpg

12.CSS3 Generator

一款非常不错的CSS3代码生成工具。

img_68bb4a67511c3f66ddbf4ae52461de8d.jpg

13.CSS3 Color Names

CSS3颜色命名对照表。

img_77f6cad7ede5fa10be2bb79570e1faee.jpg

14.Toggle CSS3 Bookmarklet

CSS3书签工具。

img_677f0041fa6029198b58cab27f0ca334.jpg

15.CSS3 Border Radius

一款在线CSS3圆角工具,四个角输入值就能生成对应的效果和代码。

img_4ae12bfd5a3641da46988f8c723782e6.jpg

16.CSS3 Desk

很炫的CSS3桌面。

img_4c91e1dbd76389b620dcdb3aa121f714.jpg

17.Web Browser CSS Support

非常详尽的浏览器对CSS支持情况,包括CSS2.1和CSS3。

img_9bf029615b4deae6987f49b5f01bb11f.jpg

18.Key CSS

让元素以键盘风格显示的样式表。

img_8d5915d50a4304daea7ed372c97d01ea.jpg

19.CSS3 Playground

一款在线CSS3圆角和阴影效果演示及代码生成工具。

img_e1724adad42f25e7d8f39c279237af8f.jpg

20.CSS3 Wrapping Drop Shadows

CSS3包装阴影效果。

img_16593385e32a8bbe9d6863bdf22b1b4d.jpg

21.CSS3 Carve Me

模仿内阴影效果,可输入内容查看效果,中文也可以噢。

img_47a56acc0ab14952d1d6113fefe726f6.jpg

22.Mother Effing Text Shadows

这工具名字太奇怪了,一款文本阴影效果工具,可即时生成代码。

img_31ed546b88659600a4bcfbc2a795199d.jpg

23.CSS3 Learning Tool

在线CSS3学习工具,可即时预览效果。

img_f98e5fd5590a8a4fc8dd41db547b5ff0.jpg

24.CSS3 Maker

最后压轴的这款工具非常强大,可在线演示渐变、阴影、旋转、动画等非常多的效果,并生成对应效果的代码,赶紧体验一下吧!

img_a6bd4ea6f04b0ec969c3bab6e832e478.jpg

  

您可能还喜欢



(编译来源:梦想天空  原文来自:Ultimate Collection of CSS3 Tools For Your Next Web Development

 

作者:山边小溪
主站:yyyweb.com 记住啦:)
欢迎任何形式的转载,但请务必注明出处。

网友评论

登录后评论
0/500
评论
秋天风景
+ 关注