Sass和Compass设计师指南

Sass是一种用Ruby开发的、用于编写CSSDSL(领域特定语言),Compass是一个用以搭建Sass开发环境的框架。

作者利用SassCompass,从无到有地构建了一个采用网格布局(Susy)与媒体查询的响应式Web页面。读完本书,你会发出“Sass与Compass也不过如此”的感慨!

首先,Sass不一定能让我们写出比以前更优化的代码,它只是个工具而已;其次,因为它只是个CSS的预处理工具,所以并不难学。

谈到CSS中的class(类),就不能不联想到面向对象程序设计。我们需要通过继承抽象类以及接口,来实现代码重用。为了克服系统的复杂性,我们又得进行模块化——划分出具有内聚力的组件。

Sass的最大特点是嵌套,它是Sass中代码的组织形式。

Sass是通过指令来重用代码的:

@extend实现了继承,带%的占位符选择器实现了抽象类@include实现了接口@mixin)的调用。变量、#{}!default&解决了硬编码的问题,@if@for@each@while与函数组成了代码重用的最小单位,@import按不同的组织层次将代码模块化

通过阅读Sass文档,你能够全面地掌握Sass的语法规则:数据类型、变量、运算符、控制流程、参数与作用域、函数与类的定义及使用、模块的导入、编译输出。

Compass除了为我们搭建Sass开发环境外,还提供了一系列的有用的混合器(如:样式重置、CSS3特性、图像精灵与data URI等),从而再也不用为厂商前缀而忧心啦!

注意事项:不要嵌套得太深;选择器不要过于具体,够用就好。至于SassCompass的安装问题,你需要学习就是那么一点命令行与Ruby知识(如:《Ruby基础教程》)。