作者利用Sass和Compass,从无到有地构建了一个采用网格布局(Susy)与媒体查询的响应式Web页面。读完本书,你会发出“Sass与Compass也不过如此”的感慨!
首先,Sass不一定能让我们写出比以前更优化的代码,它只是个工具而已;其次,因为它只是个CSS的预处理工具,所以并不难学。
谈到CSS中的class(类),就不能不联想到面向对象程序设计。我们需要通过继承、抽象类以及接口,来实现代码重用。为了克服系统的复杂性,我们又得进行模块化——划分出具有内聚力的组件。
Sass是通过指令来重用代码的:
@extend实现了继承,带%的占位符选择器实现了抽象类,@include实现了接口(@mixin)的调用。变量、#{}、!default、&解决了硬编码的问题,@if、@for、@each、@while与函数组成了代码重用的最小单位,@import按不同的组织层次将代码模块化。
通过阅读Sass文档,你能够全面地掌握Sass的语法规则:数据类型、变量、运算符、控制流程、参数与作用域、函数与类的定义及使用、模块的导入、编译输出。
Compass除了为我们搭建Sass开发环境外,还提供了一系列的有用的混合器(如:样式重置、CSS3特性、图像精灵与data URI等),从而再也不用为厂商前缀而忧心啦!
注意事项:不要嵌套得太深;选择器不要过于具体,够用就好。至于Sass与Compass的安装问题,你需要学习就是那么一点命令行与Ruby知识(如:《Ruby基础教程》)。