可供折腾的优秀前端框架

我现在接触到的前端框架是有一些,思想都不错。简单介绍一下。

blueprint, 一个基础的CSS框架。它把页面元素分成这么几类,forms表单元素,typography可见的其它元素(特别是可打印的)比如p、ul、li之类,还有一个最重要的,就是grid栅格。
所谓栅格,就是把页面分成16或24或40列。一个元素要多宽,左对齐怎么排,空多少列到下一个元素,在css中都用“列”做单位来体现。 比如页面是960宽。你需要左右两栏。左栏要占1/3,右栏占2/3。这么一个布局。在blueprint里很可能是这么写的:

<div class='container'>
<div class='span-8'>left column</div>
<div class='span-16 last'>right column</div>
</div

用栅格对程序员最大的好处是,看起来非常清晰。很容易对未来产生的页面有感觉。而且栅格很美,不是么。

类似的还有960gs,  同样有一套类似的体系。但960gs没有实现24个栅格的。我觉得24个是最好的。因为24=可以被2、3、4整除。布局是最灵活的。
[经网友Derek指点,24栅格的960gs在这里]

有了一个css框架不意味着所有事儿都干完了。用上面说的两个css框架可以把一个黑白灰纯文字的站点外观搞定,但对于现在的站来说显然是不够的。你要加上更多的颜色,交互效果等等,才能形成一个真正自己站点的css framework。

OK,现在说说JS。JS可谓各显神通。
jQuery大行其道,有jQuery了很多事情都变得简单了。包括后面出的jqtouch,把更多的交互效果给搞定了。但神器不只有jquery一个。

Tangram,百度出的javascript框架。很不幸地,它的命名空间是baidu。我可不喜欢在我公司的项目里用着一个其它公司名字的命名空间的框架。
但其实tangram不是我特别想推荐的,特别想推荐的是百度的另一个开源产品: UEditor,这是一个在线编辑器。比之前的fckeditor感觉好太多了。可以从里面找到不少好东西来,谁用谁知道。

KISSY,淘宝使用的JS框架。这个比百度的靠谱太多了。对国内做中大型站点来说,KISSY积累的代码经验非常棒,特别要推荐他们的前端开发规范:html、css、JS要怎么写,通通可以拿来主义。

最后出场的,一定是大牛。所以最后推荐的是twitter的前端框架:bootstrap,目前它的代码是托管在github上的。
新版的bootstrap,实际提供了常用的css和js的一套解决方案,包括在小屏幕的移动设备上的。也就是说,同一套html代码在手机上不用重写就可以得到相当好的浏览效果。
它提供了12列的栅格系统(少了点,不过可以用less重新生成你想要的)、表单、按钮、表格、常用的图标。然后还有group button,tab,drop-down menu等等等等。
它还提供了一些非常常用的jquery插件,比如弹出层,tooltip,警告框等,每个都非常实用。
美中不足的是——它只支持ie7以上的浏览器。ie6?骚瑞,提到这个浏览器蛋都要碎成泥了。。

Copyright © 2012. All Rights Reserved.

《可供折腾的优秀前端框架》有2个想法

发表评论

电子邮件地址不会被公开。 必填项已用*标注