日期:2014-05-17  浏览次数:20549 次

[转] 10款CSS Framework

对于JavaScript的框架已经很熟悉了,像jQuery, Ext, Dojo,最近又发现有很多的CSS Framework,转载一篇相关的文章。

?

?

?

大多数的Web设计者大都听说过“CSS Framework”, 相信一些人已经开始尝试使用过其中的一些了。

?

CSS就像其他的编程语言和脚本语言一样,在日常的编写过程中有很多的重复代码,这些重复代码也可以被整合在一起,从而减少重复劳动,使工作变的更简单。

?

使用CSS Framework, 可能会减少你的开发时间和提高效率,另一方面,如果选择了错误的框架反而会增加额外的工作量和工作时间。

?

现在有很多开源的CSS Framework,使用google便可以轻松的得到它们。今天,我将展示10款值得一看的框架,相信以后它们可以发展的很好。

?

?

  1. Blueprint: A CSS Framework


    Blueprint 是名气最大,最近很火的一个框架,它的CSS实现很好的控制了不同浏览器之间的差异,使用它可以轻松的做好浏览器兼容性。框架里面还包含了许多扩展工具和模板来帮助实现Web开发。

    ?

    ?参考:http://www.cnite.net/blog/?p=122?

    ?

    ?

    ?

  2. 960 Grid System



    ?
    另外一款出色的CSS Framework,下载的文件中包括了可供Fireworks, Photoshops, Inkscape和其他软件使用的模板,你可以马上就开始Web模板的设计。PSD文件和向导可以节省开发者大量的时间。

    ?

    ?

    ?

  3. Tripoli Framework

    Tripoli尝试支持所有的浏览器,甚至是IE5,包括一些基础文件和布局,类型等插件(很可惜,翻译的时候这个网站已经打不开了)。

    ?

    ?

    ??

  4. YAML – Yet Another Multicolumn Layout


    YAML号称是一款“防弹”的CSS Framework,它有非常好的文档,可以从官网上下载它的PDF文档和例子,从而更快的上手,框架中也同样提供了一些方便的工具,例如使用YAML Builder可以直观的创建基于YAML的CSS布局。

    ?

    ?

    ?

  5. YUI Grid CSS

    YUI Grids CSS?支持固定宽度和浮动宽度的布局,对浮动宽度布局的支持是它的一大优势。从官方网站上下载YUI的备忘单(cheat sheet)和YUI Grids Builder来开始你的学习吧。


    实际上YUI是yahoo提供的一整套Web开发辅助框架,不但是CSS布局,很早的时候就有YUI的JavaScript框架了,现在发展的也很好,有兴趣的朋友可以关注一下

    ?

    ?

    ?

  6. BlueTrip

    BlueTrip是一个全功能和华丽的框架,结合了不同的CSS框架的优势。官方网站提供了完整的文档和例子。

    ?

    ?

    ?

  7. Content With Style



    ?

    这是一个固定宽度的布局框架,压缩文件中包括了一些一列和多列的纵向导航的布局,当然还有其他的布局。

    ?

    ?

    ?

  8. Elastic CSS Framework


    Elastic?提供了一套用声明性语言来定义的布局结构和行为。这是一个年轻的框架,在它的官方网站上有使用Elastic 实现的例子,是很好的参考资料。(网站很炫哦)

    ?

    ?

    ?

    ?

  9. Molio CSS/HTML Templates


    ?

    Mollio自推出IE7的渲染而暴露了一些问题, 它是一个网站布局的起点,非常适合初学者开始CSS Framework的学习。

    ?

    ?

    ?

  10. SenCSS


    SenCSS并不包括一套布局系统,但是它提供了另外一些诸如基准线、字体、内外边距的支持。它配备了一个评论版和最小化版本,适合开发士气的使用。

    ?

    ?

另外的一些CSS Framework

  1. WYMstyle
  2. CSS-boilerplate
  3. Typogridphy
  4. CleverCSS
  5. Logicss

小结

选择一款正确的CSS Framework是非常重要的一步,我在开发中同时使用Blueprint 和 960, 并且现在开始整合各个框架的优势希望能整理出一个适合我的框架,那么,亲爱的读者你呢?

?

?

<script type="text/javascript"><!-- AKPC_IDS += "158,"; // --></script>

<!-- .entry -->

?

?

文章出自:http://www.webdesignbooth.com/10-promising-css-framework-that-worth-a-look/

?

?

?

?

?

?

?