Sass & Compass 初步使用
一、需安装的东西
ruby(mac自带)
gem(sources可能被墙)
sass
compass
查看安装情况:
ruby -v gem -v sass -v compass -v
查看 gem 的 sources:
gem sources
可参考资料
如何安装 Ruby、Sass、Compass(Windows,使用 Ruby China 镜像)
二、实操
使用终端进入选定的目录
compass 初始化
sass 编写
针对1:
mac可能用到的命令:
cd xxx ls
win可能用到的命令:
E: cd xxx dir
针对2:
进入到特定目录后,输入命令:
compass init // 方式1 compass create [project_name] // 方式2,会创建一个以project_name命名的compass目录
config.rb是compass目录的配置文件,可根据个人需求修改(重要)
针对3:
体验sass的强大吧(与css比较)
// reset @import "compass/reset"; // css3圆角 @import "compass/css3"; .box{ @include border-radius(5px); } // css3渐层 .box{ @include background(linear-gradient(lighten(red, 20%), red)); } // sprite @import "icons/*.png"; @include all-icons-sprites; //all-后面的‘icons’代表文件夹名字
compass会监测目录下文件变动而进行实时编译(可能需要watch一下)
可参考资料:
相关推荐
tianzyc 2020-02-01
ThisLX 2019-12-11
ReganHoo 2010-03-12
hankesi000 2012-05-26
momomoniqwer 2011-09-26
云端漂移 2015-07-05
libowen0 2019-06-26
YetsingZ 2019-06-25
小桥流水丿小溪 2013-05-02
aikaibo 2009-12-31
喜糖 2008-07-07
leshem 2008-06-20
jianqi 2019-06-20
libowen0 2019-06-20
lqadam 2012-06-20
吾日五省我身 2012-05-16
Dorissun 2013-11-18
AllaboutTeXnique 2018-03-05