文/前端外刊评论

注：现如今快要被各种各样的 CSS 前端框架给淹没了，真做的不错的其实也就那么几个。本文将对比五个我认为是现在最好的框架。这些框架每一个都有自己的优缺点和适用的应用类型， 你需要根据自己的需要来选择不同的框架。

例如，如果你的项目简单，就不需要使用一个复杂的框架。又或者，很多框架都是模块化的，你可以只是用你需要的模块，或者把不同框架的模块混到一起使用。

我将要介绍的这些框架的顺序与它们在 GitHub 的流行程度有关。自然，就是从最流行的 Bootstrap 说起。

提示：在接下的几周或者几个月内，下面的一些信息很可能会过时。比如 GitHub 上的 star 数、版本号等等。如果你在文章发布很久之后来读本文的话，一定别忘了这一点。还有，下面这些框架的大小指的是经过压缩的必要的 CSS 和 JavaScript 文件大小。

Bootstrap

Bootstrap 无疑地是目前这些类库的领跑者。它非常流行，流行程度还在一天天的增加。这个令人赞叹的工具集不会让你失望的，在你构建成功站点之路上少不了它。

• 作者：Mark Otto 和 Jacob Thornton
• 发布时间：2011年
• 最新版本：3.3.
• 流行程度：GitHub 上 75,000+ 的 star
• 介绍：“Bootstrap 是最流行的 HTML、CSS 和 JavaScript 框架，可用来开响应式的移动有限的 Web 项目。”
• 核心理念/原则：响应式与移动优先
• 框架大小：145 KB
• 预处理器：Less 和 Sass
• 响应式：是
• 模块化：是
• 上手模块/布局：是
• 字体图标：大半 Glyphicon图标
• 插件/扩展：无，不过有大量的第三方插件
• 特色组件：超大屏设计
• 文档：完善
• 自定义：基础的 GUI 自定义；不过你需要手动输入颜色值，因为不支持颜色选择器
• 浏览器支持：Firefox、Chrome、Safari、IE8+ （IE8 的话需要使用 Respond.js）
• 开源协议：MIT

Bootstrap 使用心得

Bootstrap 最大的优势就是它非常流行。从技术上讲，它并不是比其他在列框架要优秀。只是它有很多资源（文章、教程、第三方插件和扩展以及主题构造器等等），比起其他四个框架合到一起还要多。简单地讲，Bootstrap 就是无处不在。这也是大家继续使用它的原因。

提示:当我说“特色”的组件，这种特色就是针对目前列出的这些框架而言的。

Foundation（ZURB）

Foundation 是这个领域的第二大玩家。拥有像 ZURB 这样的公司在背后支持，不得不说它确实有一个非常坚实的基础。总之，Foundation 被很多大的网站采用。包括 Facebook、Mozilla、Ebay、Yahoo 以及 National Geographic 等等。

• 作者：ZURB
• 发布时间：2011
• 最新版本：5.4.7
• 流行程度：GitHub 上 18,000+ 的 star
• 介绍：“世界上最先进的响应式前端框架”
• 核心理念/原则：响应式、移动优先、语义化
• 框架大小：326 KB
• 预处理器：Sass
• 响应式：是
• 模块化：是
• 上手模块/布局：是
• 字体图标：Foundation 字体图标
• 插件/扩展：有
• 特色组件：Icon Bar、Clearing Lightbox、Flex Video、Keystrokes、Joyride、Pricing Tables
• 文档：完善，还有很多其他资源
• 自定义：无 GUI 的自定义工具，需要自己手动修改
• 浏览器支持：Chrome、Firefox、Safari、IE9+；iOS、Android、Windows Phone 7+
• 开源协议：MIT

Foundation 使用心得

Foundation 的确是一个非常专业的框架，有商业的支持、培训以及外包。它同时还提供很多资源，帮助你更加快速更加容易地学习和使用这个框架。