安装Sass

Sass官网网址:https://www.sass.hk/
特色
• 完全兼容 CSS3
• 在 CSS 语言基础上添加了扩展功能,比如变量、嵌套 (nesting)、混合 (mixin)
• 对颜色和其它值进行操作的{Sass::Script::Functions 函数}
• 函数库控制指令之类的高级功能
• 良好的格式,可对输出格式进行定制
• 支持 Firebug

语法
Sass 有两种语法。 第一种被称为 SCSS (Sassy CSS),是一个 CSS3 语法的扩充版本,这份参考资料使用的就是此语法。 也就是说,所有符合 CSS3 语法的样式表也都是具有相同语法意义的 SCSS 文件。 另外,SCSS 理解大多数 CSS hacks 以及浏览器专属语法,例如IE 古老的 filter 语法。 这种语种语法的样式表文件需要以 .scss 扩展名。
第二种比较老的语法成为缩排语法(或者就称为 “Sass”), 提供了一种更简洁的 CSS 书写方式。 它不使用花括号,而是通过缩排的方式来表达选择符的嵌套层级,I 而且也不使用分号,而是用换行符来分隔属性。 很多人认为这种格式比 SCSS 更容易阅读,书写也更快速。 缩排语法具有 Sass 的所有特色功能, 虽然有些语法上稍有差异; 这些差异在{file:INDENTED_SYNTAX.md 所排语法参考手册}中都有描述。 使用此种语法的样式表文件需要以 .sass 作为扩展名。
任一语法都可以导入另一种语法撰写的文件中。 只要使用 sass-convert 命令行工具,就可以将一种语法转换为另一种语法:

将 Sass 转换为 SCSS
$ sass-convert style.sass style.scss

将 SCSS 转换为 Sass
$ sass-convert style.scss style.sass

(来自:http://sass.bootcss.com/docs/sass-reference/)

如果需要使用或学习Sass,首先得安装它…
由于Sass是基于Ruby语言开发,因此需要先安装Ruby,下载地址:https://rubyinstaller.org/downloads/,建议选择较新版本
在这里插入图片描述
勾选I accept the license.
点击Next
在这里插入图片描述
选择需要安装的组件,看各自需求叭…
点击Next
最后等待安装完成,时间可能有点久…

打开cmd,输入ruby -v
如果返回 ruby 2.5.5p157 (2019-03-15 revision 67260) [x64-mingw32]
恭喜你,证明你已经安装成功了

找到 在这里插入图片描述
删除gem源 gem sources --remove https://rubygems.org/
添加新的gem源gem sources -a http://rubygems.org/(之前安装时遇到过很多坑,所以使用http://rubygems.org/就没毛病了)
打印gem sources -1查看是否替换成功
*** CURRENT SOURCES ***
http://rubygems.org/

安装sass (等待安装完成)
gem install sass
最后安装compass(安装较慢)
gem install compass
安装完成后
输入sass -v确保sass已安装完成
Ruby Sass 3.7.4
输入compass -v确保compass已安装完成
compass -v

Compass 1.x.x (Polaris)
Copyright © 2008-2015 Chris Eppstein
Released under the MIT License.
Compass is charityware.
Please make a tax deductable donation for a worthy cause: http://umdf.org/compass

恭喜你已全部安装完成

文件转换命令 sass style.sass style.css

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值