`
Javaloverlover
  • 浏览: 342854 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

sass技术中后缀名.sass和.scss的区别与个人推荐

    博客分类:
  • sass
阅读更多
sass是一种对css的一种提升,可以通过编译生成浏览器能识别的css文件。sass技术的文件的后缀名有两种形式:.sass和.scss。这两种的区别在于.sass文件对代码的排版有着非常严格的要求,而且没有大括号,没有分号。
一个a.scss文件代码如下:
.a {
	color: blue;
	font-weight: bold;
	text-decoration: underline;
	.b {
		color:black;
	}
}

通过sass a.scss a.css编译出来的css文件为a.css:

.a {
  color: blue;
  font-weight: bold;
  text-decoration: underline; }
  .a .b {
    color: black; }

但是这样的代码将后缀改成.sass就不能通过编译了。首先.sass不要大括号,其次不需要分号,还有行首空格问题,比如第一个元素的属性空2个空格就不能通过编译。.sass文件需要严格的格式要求:
.div
 color: blue
 .b
  color: black
  font-weight: bold
  text-decoration: none
  .c
   color: white

编译后:

.div {
  color: blue; }
  .div .b {
    color: black;
    font-weight: bold;
    text-decoration: none; }
    .div .b .c {
      color: white; }

所以博主推荐大家使用.scss文件,使用起来更顺手。

交流群:132607763
若满了请加:251207741
分享到:
评论
1 楼 rambolovepanda 2014-02-27  
个人还是比较喜欢 sass语法  不需要{  更接近ruby python 编程风格

相关推荐

Global site tag (gtag.js) - Google Analytics