• :绿叶3.0 beta版已推出(点击查看),欢迎小伙伴尝鲜使用。新版网站暂时处于测试阶段,如果没有太大问题,将于11月份采用主站域名。

1.3 Sass和Scss

在Sass中,有2种语法格式:(1)Sass格式;(2)Scss格式。也就是说,平常我们所说的Sass和Scss其实是同一个东西来的,统称为Sass。Sass和Scss仅仅是Sass的两种语法格式罢了。

一、Sass格式

Sass格式,是Sass的“旧版本语法”。这种语法格式,不使用大括号“{}”和分号“;”,而是使用严格的缩进式语法规则来书写,也就是类似Ruby语言的写法。

举例:

 
$color:white
$bgColor:red

body
color:$color
background-color:$bgColor

说明:

从这里我们可以看出,Sass格式是不使用大括号“{}”和分号“;”的,并且在body元素定义样式的时候,color和background-color这2个属性都是严格缩进的。

二、Scss格式

Scss格式,是Sass的“新版本语法”。这种语法格式,使用大括号“{}”和分号“;”,并不使用严格的缩进式语法规则来书写,也就是类似CSS书写的格式。

举例:

 
$color:white
$bgColor:red

body
{ 
    color:$color
    background-color:$bgColor
}

说明:

从这里我们可以看出,Scss格式跟平常我们写CSS的格式是一样的。

:本站所有教程均为原创,大部分已经与人民邮电出版社合作出版,禁止转载和抄袭,否则绿叶学习网和人民邮电出版社必将追究法律责任,附录:互联网著作权保护法。【法律顾问:张俊律师】

小伙伴们也可以加一下QQ群,在“群文件”中可以获取配套资源以及更多学习资源,以及跟其他小伙伴交流,站长也在群内。

(1)QQ群:662583120(暗号:lvye

(2)绿叶学习网常见问题解答

回到顶部