09前端成长日记-sass

132 阅读1分钟

sass 安装(Mac)

详细步骤 www.jianshu.com/p/b486f4e64…

1.先查看电脑上是否安装ruby,

$ ruby -v

如果已经安装可以看到提示ruby版本信息

2.安装sass,在终端输入

$ sudo gem install sass

3.等待安装完成

利用sass自动将px换算成rem

1.在项目文件中新建css文件和scss文件
2.在终端输入命令关联scss和css,这样就能自动将scss翻译成css

自动编译时文件路径上不能有中文

$ sass --watch style.scss:style.css 

3.在scss文件内写入方法

@function px( $px) {
    @return $px/$designWidth+rem;
}
$designWidth: 375; /*设计稿宽度*/

div {
    width: px(20);
    height: px(20);
}