sass(scss£©的安装与使用教程

  发布时间£º2018-10-15 09:50:42   作者£º佚名   我要评论

CSS预编译器有 SASS LESS Stylus等等£¬SCSS是SASS3引入的新语法¡£这篇文章给大家介绍sass(scss£©的安装与使用教程£¬感兴趣的朋友一起看看吧

CSS预编译器有 SASS LESS Stylus等等£¬SCSS是SASS3引入的新语法¡£那为什么要选择SCSS呢£¿那我只能说我喜欢啊£¡不管SASS也好£¬LESS也罢£¬还是Stylus都只是一种工具£¬各有各的优缺点£¬选择自己喜欢的用着舒服的就是了¡£没必要纠结这么多¡£

准备工作£¨注意£º这是windows?#25945;?#19979;的安装£©

1.1 安装¡¡¡¡

SASS是Ruby语言写的£¬但是两者的语法没有关系¡£所以?#27426;®Ruby£¬一样可以使用¡£只是必须先安装Ruby£¬然后再安装SASS¡£

¡¡¡¡根据自己系统的位数£¨64 OR 32£©选择合适的安装包£¬下载安装包之后双击打开£¬一路下一步£¬完成£¡

¡¡¡¡

¡¡¡¡打开ruby的控制台£¬输入ruby -v£¬如果出现以下结果£¬则证明ruby安装成功£¡

ruby -v

¡¡¡¡

¡¡¡¡安装完ruby之后£¬直接在控制台就可以安装SASS¡£

gem install sass

¡¡¡¡至此£¬SCSS安装完毕£¡

1.2 使用

SASS文件就是普通的文本文件£¬里面可以直接使用CSS语法¡£文件后缀名是.scss£¬意思为Sassy CSS¡£  

下面的命令£¬可以将.scss文件转化的css代码并保存到一个新文件中¡££¨假设文件名为app¡££©

sass app.scss app.css

SASS提供四种编译风格的选项£º

nested£º嵌套缩进的css代码£¬它是默?#29616;µ¡?expanded?#22909;?#26377;缩进的¡¢扩展的css代码¡£ compact£º简洁格式的css代码¡£ compressed£º压缩后的css代码¡£

编码风格自行设置£¬用一次就知道了嘛¡£

1.3 安装KoalaKoala

Koala是一款图形化界面的编译软件£¬支持Sass Less CoffeeScript的编译¡£官网下载直接安装£¬不过需要依赖于Ruby¡£具体安装就不做介绍了¡£

¡¡¡¡

以上所述是小编给大家介绍的sass(scss£©的安装与使用教程£¬希望对大家有所帮助£¬如果大家有任?#25105;ÉÎ是?#32473;我留言£¬小编会及时回复大家的¡£在此也非常感谢大家对脚本之家网站的支持£¡

相关文章

  • CSS的Sass框架中常用的操作符的使用教程

    这篇文章主要介绍了CSS的Sass框架中常用的操作符的使用教程,整理了一些基本的逻辑操作符和字符串操作符等的翻译和用法,需要的朋友可以参考下
    2016-03-08
  • CSS框架sass的简单一览

    这篇文章主要介绍了CSS框架sass的简单一览,像嵌套属性和运算符等主要特性都在文中有简单的介绍,需要的朋友可以参考下
    2015-07-20
  • CSS的SASS样式编程指南

    这篇文章主要介绍了CSS的SASS样式编程指南,包括对于嵌套器和注释的使用等方面,需要的朋友可以参考下
    2015-07-12
  • 学习CSS预处理器:Sass和less进行对比

    Css可以让你做很多事情£¬但它毕竟是给浏览器认的东西£¬对开发者来说£¬Css缺乏很多特性
    2012-07-11

最新评论

ÁÉÄþ35Ñ¡7¿ª½±½á¹û