sass与scss的区别

用了很久css预编译器，但是一直不太清楚到底用的sass还是scss，直到有天被问住了有点尴尬，找了个教程撸了遍==。。。

异同：简言之可以理解scss是sass的一个升级版本，完全兼容sass之前的功能，又有了些新增能力。语法形式上有些许不同，最主要的就是sass是靠缩进表示嵌套关系，scss是花括号

//sass 太费眼了
.fatherwidth:100px;.sonwidth:50px;
//scss 适合我这种眼瘸手残患者
.father{width:100px;.son{width:50px;}
}

2 scss功能很强大的样子，能做运算、写函数啥的，但是我只是作为语法糖用而已，只看了些基础功能
我个人常用的功能有：

嵌套
变量 $color : #111111;
混入 @mixin
继承 @extend

3.一个关于@mixin、@extend、%placeholder的适用场景总结

mixin 可以传变量
extend 不可以传变量，相同样式直接继承，不会造成代码冗余；基类未被继承时，也会被编译成css代码
placeholder 基类未被继承时不会被编译成css代码

慕课网的总结：

sass与scss的区别相关推荐

SASS 和 SCSS 的区别
原文 Difference Between SASS and SCSS SASS(Syntactically Awesome Style Sheets)是一种由 Hampton Catlin 设计.C ...
Sass和Scss的区别
区别: Sass 和 SCSS 其实是同一种东西,我们平时都称之为 Sass,两者之间不同之处有以下两点: Sass是以".sass"后缀为扩展名,Scss是以scss后缀为扩展名 ...
webstorm和intellij idea下如何自动编译sass和scss文件
前言学过css的人都知道,css他不是一个编程语言.虽然你可以用css去写网页样式,但是你却没法使用它进行编程.所以有一句话来描述css我个人觉得再合适不过了,"CSS基本上是设计师的工具 ...
关于sass（scss）、less、postcss、stylus等的用法与区别
一. Sass/Scss.Less.stylus是什么? 它们都是css预处理器.css预处理器的概念:CSS预处理器用一种专门的编程语言,进行Web页面样式设计,然后再编译成正常的CSS文件,以供项 ...
scss、sass 和 css 的区别
项目中,会经常使用诸如scss.sass的style样式,它们和css有什么区别呢? less大家应该都不陌生,同样的scss.sass一样,它们都可以称为:CSS预处理器语言. 简单来说,scss和 ...
sass、scss、less区别
Sass (Syntactically Awesome StyleSheets),后缀名为.sass,是由ruby语言编写的一款css预处理语言 SCSS (Sassy CSS),后缀名为 .scss ...
Css、less和Sass（SCSS）的区别
随着前端开发的不断发展,CSS也逐渐延伸出了很多新的语言,less和Sass就是其中两种,下面我们就一起来看看它们到底有何区别. 背景 CSS(Cascading Style Sheets,层叠样式表 ...
Sass、Scss、Less和Stylus区别总结
Sass.Scss.Less.Stylus CSS 预处理器技术已经非常的成熟了,而且也涌现出了越来越多的 CSS 的预处理器框架.本文便总结下 Sass.Less CSS.Stylus这三个预处理器 ...
css，sass，scss和less的区别
css,sass,scss和less的区别 1.css 层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语 ...

sass与scss的区别

sass与scss的区别相关推荐

最新文章

热门文章