Compass简单入门

一、Compass是什么？

简单说，Compass是Sass的工具库。
Sass本身只是一个编译器，Compass在它的基础上，封装了一系列有用的模块和模板，补充Sass的功能。他们之间的关系，有点想JavaScript和jQuery的关系。

二、安装

Compass是用Ruby开发的，所以在安装它之前，必须安装Ruby。
之后，在命令行模式下输入：

#mac
sudo gem install compass

#windows
gem install compass

三、项目初始化

创建一个名为com-test 的项目，那么在命令行输入：

compass create com-test

当前目录中就会生成一个com-test的子目录。
进入目录后，发现有一个config.rb的配置文件，一个存放Sass源文件的sass文件夹和一个存放编译后的css文件的stylesheets的文件夹。

四、编译

Compass的编译命令是

compass compile

生产环境需要压缩后的css文件，这时要使用–output-style参数：

compass compile --output-style compressed

Compass只编译发生变动的文件，如果你要重新编译未变动的文件，需要使用–force参数。

compass compile --force

在命令行模式下，除了一次性编译命令，compass还有自动编译命令：

compass watch

运行该命令后，只要scss文件发生变化，就会被自动编译成css文件。

五、模块和函数

Compass采用模块结构，不同的模块提供不同的功能。目前。它内置五个模块：

*reset
*css3
*layout
*typography
*utilities

除了模块，Compass还提供了一系列函数。
有些函数非常有用，比如image-width() 和 image-height()返回图片的宽和高。