🎶 Sym - 一款用 Java 实现的现代化社区(论坛/BBS/社交网络/博客)平台

📕 思源笔记 - 一款桌面端笔记应用,支持 Windows、Mac 和 Linux

🎸 Solo - B3log 分布式社区的博客端节点,欢迎加入下一代社区网络

♏ Vditor - 一款浏览器端的 Markdown 编辑器

20 个对学习 CSS3 大有裨益的资源

      译者按:CSS2的出现让web顿时丰富起来,特别是web2.0时代CSS成为每个web页面都必不可少的元素。但是随着web技术的发展,CSS2已经不能满足web开发的需求,例如属性选择、AJAX出现后与JS的交互等,因此对下一代的CSS需求越来越明显。目前CSS3还 处于草稿阶段,但是其某些特征已经让人兴奋不已。目前主流浏览器Firefox、IE7/8、Webkit等都已经部分地支持CSS3。因此提前了解 CSS3是十分必要的。下面提供的20个学习资源中,多数是单篇的文章和访谈记录等,可见这方面的资源还是比较少的,作为一个真正的CSS开发者,走在别 人的前面提前了解、运用、研究CSS3也是十分必要的。

    尽管W3C还没有最终设定CSS3规范,但是像Mozilla Firefox、Opera以及基于Webkit等的现代浏览器已经开始部分或者全部地支持CSS3了。

    作为一个web开发者,充分了解当前和未来的web标准是十分必要的。为帮助大家能够走在趋势的前列,我们特意向推荐下面这20个关于CSS3的优秀学习资源。

1 、CSS3 Progress Report(CSS3项目报告)



 CSS3 Progress Report(CSS3项目报告)是CSS工作小组用以对外介绍CSS3模块当前进展状态的官方网站。对于志愿贡献者来说,这里可能是你学习和为CSS3提供改进的最好的地方。

2、 Get Started with CSS3CSS3入门



Web Monkey为CSS3入门提供了一个大体框架。本站概述了已经在现代浏览器中得到支持的CSS3属性。对于刚刚开始探索CSS3的人来说这是一篇了不起的著作(我已经将这篇文章翻译成中文,有兴趣的朋友可以看一下《CSS 3入门》)。

3 、Progressive Enhancement with CSS3(CSS3的渐进增强)



Opera,在支持CSS3规范中一直走在前列的一款浏览器,对CSS3在“渐进增强”中的应用有着十分出色的表现。在采用了CSS3的“渐进增加”计划中讨论了你如何在已经使用支持CSS3的现代浏览器和还没有支持CSS3的传统浏览器应用CSS3。

4 、Accessibility Features of CSS

Accessibility Features of CSS

随着移动手持设备和诸如屏幕阅读器等非传统web浏览器的不断增加,作为对CSS3的一项重要改进,CSS工作小组增加了CSS3的易用性。W3C文档指出在当前和未来的CSS3规范中将会继续保留这些易用的特性。

5. Introduction to CSS3 (Design Shack)

Introduction to CSS3 (Design Shack)

在这个由5部分组成的系列中,Design Shack给读者了一个关于CSS3的完美诠释。文章以朴实的语言对CSS3做了详尽的解释,并对着重讲述了边框文本效果等CSS3技术。

6. CSS3 . Info



CSS3.info是一个关于CSS3方面的极其全面的网站。他们提供了有关CSS3的新闻、访谈记录以及各类资源。该站还提供了一个名为CSS3 Previews的演示模型,因此你可以通过Opera和其他基于Webkit的浏览器来体验CSS3的相关模块和功能。

7. CSS Advanced Layout Module

CSS Advanced Layout Module

了解CSS3规范中更加常用的模块:高级布局模块(the Advanced Layout Module)。 这是W3C的一个工作草稿,不过它足以向我们这些web开发者显示CSS3的伟大之处了。

8. Six Questions: Eric Meyer on CSS3



Eric Meyer是一个有幸参加6次CSS3修订的CSS专家。在这次访谈中,Eric Meyer说其中最让他兴奋的CSS3中的模块方向的发展以及与JavaScript的紧密关系。你可以直接点击这里查看“就 CSS3 向 Eric Meyer 请教的 6 个问题” 。

9. CSS3 properties tests for webkit based browsers



在这个在线演示中,你会打到诸如Safari等基于Webkit的浏览器目前已经支持(和未支持)的CSS3属性;它还提供了可用于iPhone的一些CSS3属性的相关信息。

10. WaSP Community CSS3 Feedback



本文是对于web标准项目(Web Standards Project,WaSP )发表的一篇名为“告诉CSS工作小组你喜欢从CSS3中得到什么(Tell the CSS WG what you want from CSS3)”博客的反馈信息的详细总结。通过这篇文章你可以看到世界web开发者对目前CSS3规则期望。

11. CSS 3 attribute selectors



CSS3中一个令人兴奋的改进就是对于复杂而以具体的DOM的选择能力。Dev.Opera展示了CSS3中这项新属性选择功能。

12. W3C: Selectors



选择符是W3C在CSS3工作草图中引入的一个相当棒的概念。

13. Conversation with CSS 3 team



XHTML.com对于Bert Bos(前W3C CSS工作小组主席)的采访以CSS顶级专家的眼光审视CSS3的开发。

14. The fundamental problems with CSS3



Matt Wilcox的这篇文章围绕CSS3讨论了当前要解决的一些问题。

15. CSS Working Group Blog



CSS标准的维护和开发者,CSS工作小组(CSS Working Group, CSS WG),经常更新其博客以提供有关CSS3的有用信息。

16. Rounded Corner Boxes the CSS3 Way



年度在线出版物24 Ways上发表了一篇名为“顶级web专家(top web professionals)”的文章,这是CSS专家Andy Budd的一篇关于用CSS实现圆角框的文章。它展示了CSS3的一个样式改进:不使用CSS实景实现圆角框。

17. Push Your Web Design Into The Future With CSS3



图形与网页设计家Chris Spooner在Smashing杂志上发表这篇文章深入研究了利用当前已经公布CSS3规范设计网页的草图。这一切现在你就可以用CSS3来做,着实鼓舞人心。

18. Introduction to CSS3 Transparency



这篇文章探索并解释了CSS3中透明度的概念,这也是CSS色彩模块(CSS Color Module)中的一个概念。

19. Styling Forms with Attribute Selectors



Dev.Opera在样式化表单的示例中展现了属性选择器的好处。

20. 5 Techniques to Acquaint You With CSS3



熟能生巧,NETTUTS的这个教程教你如何在应用中学习CSS3。这篇文章中包括了如何给页面中的元素增加阴影和改变元素的透明度等。

今天您使用CSS3了吗?
在您的web开发实践中你使用到了CSS3吗?你在学习CSS3的过程中处于什么阶段了?请在下面的评论中和我们一起分享你的想法与经验。

延伸阅读
Resetting Your Styles with CSS Reset
Structural Naming Convention in CSS
Innovative (and Experimental) CSS Examples and Techniques
8 CSS Techniques for Charting Data

本文原文:http://sixrevisions.com/css/20-useful-resources-for-learning-about-css3/
中文译文:http://www.dudo.org/article.asp?id=266


欢迎注册黑客派社区,开启你的博客之旅。让学习和分享成为一种习惯!

留下你的脚步