Sass初级

Sass入门

你是否一直想学Sass,但却始终没有行动?你是否是Sass的使用者,但却感觉自己只是多了一个工具?那么请继续读下去,让我们一起重温Sass的特性和另外一些很酷的东西吧。Sass (Syntactically Awesome Style Sheets)是一个CSS预处理器。Sass与CSS关系就像CoffeeScript与Javascript关系。它通过添加标记到样式表中,帮助我们更轻松惬意的书写CSS。

【Sass初级】开始使用Sass和Compass

如果你的朋友、同事或网友有跟你说过Sass或者Compass,或者两者,那太棒了。现在怎么办?在这篇初学者指南中,我首先带领大家使用Sass和Compass。我将告诉大家如何完成安装和创建一个测试项目。怎么使用Sass编译CSS,甚至还会告诉大家有关于Sass中的"mixin"。

【Sass初级】嵌套选择器规则

众所周知Sass是一种高效、可靠而又精确的工具,给了我们很多自由空间,让开发者减少使用CSS的一些痛苦,当然,这也意味着一种新的责任到来。在CSS中,我们都知道所有代码都在一个“根级别”的选择器中,每个CSS的样式声明都写嵌套的话,那意客味需要写很多的代码。今天我要带领大家进入到Sass的最基本原则中。这就是所谓的“基础规则(Inception rule)”。此规则可以帮助你避免一些常见错误(使用Sass的常见错误),不管是你Sass的初学者,还是中级或者高级Sass开发者。

【Sass初级】如何组织一个Sass项目

Sass最有用的一个特性就是可以将你的样式表分隔成很多个单独的文件。然后,你可以在主样式文件中通过@import引入你所需要的.scss文件。但是你应该如何组织你的Sass项目呢?有没有分离样式文件的一个标准呢?Hugo Giraudel早前写过一篇关于这方面的教程《管理Sass项目文件结构》,今天我们一起看看John W. Long对Sass项目文件组织有何看法或经验,值得我们去学习。

【Sass初级】定义好的变量名

Sass中的定义变量是非常的强大的,你可以在一个地方定义好变量,在项目的多个地方使用这个定义的变量。它允许你在集中的一个地方做变化,而不需要在项目和多个文件中使用查找替换的方式来做修改。但是选择一个好的变量名是一件比较困能的事情。如果你不小心,在项目中变量很容易失控。最常见的就是你会忘记了在项目中定义了什么变量名,因为你很难记住你定义的所有变量名,这样有可能会给你在项目开发中带来不必要的挫折。

返回顶部