5种流行的CSS框架+入门教程和工具
网站建设CSS框架最近流行起来，使开发人员能够快速原型设计。CSS框架的理念是在每个站点上反复做重复的任务，让你得到更快的结果，并得到设计师们喜欢的有趣的东西。
好CSS框架的主要特点是1）快速加快我们的开发时间，2）应该有一个非常小的尺寸，3）有良好的文档和教程，4）有干净的网格结构。您需要对CSS框架有一个基本的了解，您将使用它来理解为什么和如何解决问题。

在今天的文章中我们提出的5个最流行的CSS框架概述；展示精心挑选的教程使用它们以及其他有用的工具和资源，你肯定会找到有用的和节省时间的。

1。960 CSS框架
960网格系统致力于通过提供常用的维度（基于960像素的宽度）来简化Web开发工作流。有两种变体：12和16列，可以单独使用或串联使用。的960.css文件本身只有3.6 KB的压缩。

“杰夫瑞”在960个CSS框架的密切关注，说明使用它的利弊。他还一步一步地带领我们创建一个简单的“12列”布局，有一个简单的标题和两列结构。最重要的一点是：你必须指定一个类，每个部门命名规范要求，类的名字开始与“grid_”与所需的列数端。

960 CSS框架–学习基础知识
Stefan Vervoort以沉重的工作为你解释这个基本框架让你可以从960个漂亮的快速发展。基本原则包括：不解释编辑960.css，加载网格、容器、网格/柱，空间和造型。斯特凡的另一篇文章，他解决了在使用这个框架时所面临的一些问题。

流体960网格系统模板已经建立在拿芬史密夫和他的960网格系统使用来自MooTools的JavaScript库工作中的作用。

蓝图是一个CSS框架，旨在减少CSS开发时间。它给你一个坚实的CSS基础建设项目上，用一个简单易用的网格，合理的排版，漂亮的形式，甚至一个样式表打印。它的主要功能之一是对浏览器默认样式进行批量重置，提供了一种用于可定制布局网格的方法，最重要的是所有元素都可以重写。

有几个可用的蓝图插件，可以覆盖框架的各个方面，或者添加新样式供您使用。
说明如何使用CSS CSS框架和工具的教程

BlueprintCSS 101

Jeff Croft解释蓝图的核心特征，我们如何使用它，它已经影响了我们的工作流程，我们喜欢它。

仔细看看Blueprint CSS框架

在本教程中，我们将了解蓝图的内部工作，我们将看一看演示应用程序，它使用蓝图来更好地了解如何实际使用框架。

蓝图CSS备忘单

蓝图网格CSS生成器

此工具将帮助你产生更灵活的蓝图的grid.css和compressed.css版本和grid.png使用图像文件在发展背景图像非常方便，确保一切线正确。你是否喜欢8、10、16或24在你的设计中的列，该发电机现在使你的灵活性与蓝图。

pxtoem.com是一个网站，让他们更容易转换像素值的值。你选择的价值观的CSS文件可以得到基于CSS的蓝图typography.css部分设置一个默认的字体。

构建一个可视化的布局编辑器，基于蓝图和jQuery，构建一个有用的工具和CSS设计师证明视觉布局编辑器可以实现干净的CSS和语义化的HTML。

jQuery包含一个健壮的CSS框架，用于构建定制的jQuery小部件。该框架包括类，涵盖范围广泛的通用用户界面的需求，并且可以使用jQuery UI themeroller操纵。通过使用jQuery CSS CSS框架构建UI组件，您将采用共享标记约定，并允许整个插件社区轻松实现代码集成。

一个真实世界的例子，主题化的按钮和工具栏使用jQuery UI的CSS框架，一类开发的jQuery UI插件，可以很容易地应用到任何插件系统，甚至静态内容。下面是按钮示例，演示如何将CSS框架类的力量集成到自定义小部件中。

4. YAML
YAML（另一个多列布局）专注于灵活的布局和提供列和网格柔性基础的设计元素，弹性或固定的布局。你需要许可证才能使用它。

YAML是一个很不错的Ajax生成器，基于CSS布局允许你把布局容器视觉通过拖放的YAML的可视化开发一个方便的工具。有效的HTML和CSS代码是自动生成的。

Dirk Jesse，YAML开发者（另一个多列布局），一个（x）HTML和CSS框架，阐述了他在文章的最后一段，YAML的动机，提供什么是可能与YAML的概述和可能对你未来的布局提供一些思路。

5。雅虎YUI网格的CSS
基本的YUI网格CSS提供四种预设的页面宽度，六个预置模板，并且能够栈巢细分地区两，三，或四列。4KB文件提供了超过1000的页面布局的组合。特点包括：自动清理页脚，定制宽度为固定宽度布局，支持流体宽度（100%）布局和更多。

YUI网格生成器网格定制一个简单的界面。

别忘了检查CSS重置/基/字体/网格备忘单。

看看这里的现场演示

复杂的流体布局在三个简单的步骤

本教程介绍了如何在三个简单的步骤创建CSS布局在所有现代浏览器毫不费力地使用YUI网格工作。

YUI CSS网格：太棒了，但没用？

Jeff Croft问YUI CSS网格的网站比750px有一定的局限性，Dustin Diaz在解释了一些有趣的功能和使用方法我们可以使用YUI CSS网格。“一个很酷的事情我已经做了它是几乎与一类名称除相同的HTML七不同的模板（yui-t（1-7））。这很好，因为它完全独立于源代码。如果我想在我的网站上你可以换出一个类名，而不是一个全新的CSS文件的方法的一个样式切换器。因此，没有理由为整个“入侵身体的开关”

值得检查的CSS框架

–typogridphy

流行的CSS框架：10个有用的教程

一个排版布局CSS框架允许网页设计师和前端开发人员快速的代码typograhically愉悦的网格布局和网格。基于960网格系统，typogridphy允许你创建它是通用的，大电网布局看。