?
? 前言:
?
? ? ? ?其实sass出来都不知道多久了,但是针对N多不了解或者了解了没实践的同学,还是hand by hand一下吧,希望能帮助到你!
?
??
? 正文:
?
? ? ? ?本系列开篇就不介绍sass是什么了,有兴趣直接百度,本文直接教你如何安装环境?
?
- 需要ruby
? ? ? 下载地址: http://rubyforge.org/frs/?group_id=167&release_id=28426
?
? ? ? ?如图:选择1.9.2-p180下载
?
??
?
?
- 下载完成后,双击安装, 如下图,?建议对Add Rudy那个打上勾:
? ? ??
?
?
- 安装完成后,在开始菜单,选择Start Command
? ? ??
?
?
- 输入:gem install haml
? ??
? ? ?
?
- 输入:gem install sass
? ??
? ? ?
?
?
- 成功后,在D盘建立一个sass的文件夹,然后建立一个1.sass的文件,内容直接粘贴官网:
? ? ? ??
?
? ? ? 代码直接粘贴:
?
$blue: #3bbfce $margin: 16px .content-navigation border-color: $blue color: darken($blue, 9%) .border padding: $margin / 2 margin: $margin / 2 border-color: $blue
?
- cd到对应的sass文件目录(比如:d盘的sass文件夹),在执行
? ? ? ??
?
?
- 查看文件目录,发现会编译出一些新文件,如图:
? ?
? ? ? ? ?
?
- 我们看看style.css编译生成的内容,如图:
? ? ??
? ? ? ??
?
?