你可能用不到很多大型 UI 框架中的大部分功能,如BootStrap,特别是当你在开发小型、简单的项目的时候,你需要的只是尽快的启动并能运行它。幸运的是,有很多更小型的 CSS 框架,你可以用来做替代品。

使用一个小型的 CSS 框架对开发者来说是更温和的学习曲线,对于JavaScript功能没有依赖,对用户来说是更快的加载速度。

我这里为大家提供了一个小型、简约的CSS框架列表,它们大部分都在5KB(压缩后)以内,并且包含了构建响应式网页设计的要素。

1. Min

0577-01-small-css-framework-min

Min,是这个列表中最小的 CSS 框架,具有响应式的 12 列栅格系统、按钮样式、表格样式、兼容Android的图标等等。Min 甚至支持像 IE 5.5 这样古老的浏览器。

2. Milligram

0577-02-small-css-framework-milligram

Milligram 提供了现代化的UI–它的栅格系统采用 Flexbox,大小和长度才有 rem 单位,并且是移动优先的。但这也是有代价的,它只支持最新的Chrome、Firefox、IE、Safari和Opera等浏览器。

3. Blaze CSS

0577-03-small-css-framework-blazecss

Blaze CSS 自身已经是一个轻量级的框架了,但你还是可以精简它的体积,因为它的模块化的构架,它允许你只包含你在项目中需要使用的部分以缩减文件大小。(点击此处获取更多精简该框架的信息。)

4. Kube

0577-04-small-css-framework-kube

Kube 包含了一个体积小于 6KB 的 CSS 框架,它具有响应式的栅格系统、用于创建表单的类集合、多种表格类、显示重要信息的通知类等等。

5. Pure

0577-05-small-css-framework-purecss

Pure 是雅虎的一个开源项目,是一套可以帮你快速构建响应式设计的 CSS 模块,Pure 为所有的 HTML 元素都设置了基本样式,基本模块有:栅格系统、WEB表单、按钮、表格、导航菜单等。

6. Furtive

0577-06-small-css-framework-furtive

自称为“CSS微框架”的 Furtive 面向现代网页设计,同 Milligram ,Furtive 也是移动优先、基于FlexBox 的栅格系统、使用 rem 作为长度和大小单位。它的基本内容包括:按钮、表单、甚至还包括默认颜色。

7. Skeleton

0577-07-small-css-framework-skeleton

虽然有一年多时间没更新了,Skeleton 仍然是构建现代化的、响应式WEB设计的一流框架。它配备了一个响应式的栅格系统和默认的HTML元素样式。

8. FOX CSS

0577-08-small-css-framework-foxcss

FOX CSS 是一个轻量级、模块化的 CSS 框架,采用移动优先的设计方式,甚至支持 IE9。

9. Basscss

0577-09-small-css-framework-basscss

Basscss 由 22 个模块组成: CSS reset、栅格系统、颜色类、构建响应式的实用类等等。Basscss 最大的特点是它的文件大小还不到 4KB。

10. Siimple

0577-10-small-css-framework-siimple

Siimple 是一个简约的构建响应式、干净的 WEB 设计框架。类似于 Skeleton,它具有 12 列的栅格系统,字体、表格、按钮、表单等的基本样式。

11. Lotus

0577-11-small-css-framework-lotus

Lotus 是最小的 CSS 框架之一。它的主要特点有:响应式的栅格系统、字体、按钮、WEB表单等。

12. Picnic CSS

0577-12-small-css-framework-picnic

Picnic CSS 是一个使用 SASS 编写的轻量级 UI 框架,使得你更加容易编辑和定制变量:如颜色和长度。它也有一些响应式的、纯CSS的组件,如模态窗口、内容滑块等。