sass与less区别

一. Sass/Scss&Less是什么?
Sass (Syntactically Awesome Stylesheets)是一种动态样式语言,语法跟css一样(但多了些功能),比css好写,而且更容易阅读。Sass语法类似与Haml,属于缩排语法(makeup),用意就是为了快速写Html和Css。
Less一种动态样式语言. 将CSS赋予了动态语言的特性,如变量,继承,运算, 函数. LESS 既可以在客户端上运行 (支持IE 6+, Webkit, Firefox),也可一在服务端运行 (借助 Node.js)。less英文站需要翻墙,也可以访问中文站
Sass与Scss有什么差别
Sass原先跟Haml一样的缩排语法,对于写惯Css的前端来说是很不直观的,也不能将原来的Css加到Sass里面,因此Sass改良了语法,Sass 3就变成了Scss(Sassy CSS)。与原来的语法兼容,只是用{}取代了原来的缩进。
二. Sass/Scss&Less区别?
1.Sass是基于Ruby的,是在服务端处理的,而Less是需要引入less.js来处理Less代码输出Css到浏览器,也可以在开发环节使用Less,然后编译成Css文件,直接放到项目中,也有Less.app、SimpleLess、CodeKit.app这样的工具,也有在线编译地址。
2.变量符不一样,less是@,而Scss是$,而且变量的作用域也不一样,后面会讲到。
3.输出设置,Less没有输出设置,Sass提供4中输出选项:nested, compact, compressed 和 expanded。
4.Sass支持条件语句,可以使用if{}else{},for{}循环等等。而Less不支持。

版权声明:本文为博主原创文章,未经博主允许不得转载。

时间: 2024-10-15 03:03:56

sass与less区别的相关文章

.sass 和 .scss 区别

ionic2中使用的是.scss,那.scss和.sass有什么区别呢? 以下为官方的 2 个实例: 文件扩展名不同,Sass 是以".sass"后缀为扩展名,而 SCSS 是以".scss"后缀为扩展名 语法书写方式不同,Sass 是以严格的缩进式语法规则来书写,不带大括号({})和分号(;),而 SCSS 的语法书写和我们的 CSS 语法书写方式非常类似. 详情: 参考文档:     1. http://sass-lang.com 2. http://sass.

浅谈Sass与Less区别、优缺点

Sass是一种动态样式语言,Sass语法的缩排语法,比Css比多出很多功能,如变量,嵌套,运算,继承,颜色处理,函数等,易于阅读.Cass的安装需要安装Ruby环境,是服务器端处理的,Less是需要引入Less.js来处理代码输出css到浏览器,也可以在开发环节使用Less,然后编译成css文件,直接放在项目中,有less.app.SimpleLess.CodeKit.app这样的工具,也有在线编辑地址. 事实证明,LESS——以及Sass——功能比这个要多太多.LESS和Sass在语法上有些共

浅谈sass与less区别优缺点

Sass是一种动态样式语言,Sass语法的缩排语法,比Css比多出很多功能,如变量,嵌套,运算,继承,颜色处理,函数等,易于阅读.Cass的安装需要安装Ruby环境,是服务器端处理的,Less是需要引入Less.js来处理代码输出css到浏览器,也可以在开发环节使用Less,然后编译成css文件,直接放在项目中,有less.app.SimpleLess.CodeKit.app这样的工具,也有在线编辑地址. 我偶然发现LESS之后我就开始坚定的使用它了.CSS本身对我来说从来不是问题,但是我很好奇

css扩展技术:Less和Sass的区别

这个周学习了Less和Sass这两个css框架,我基本了解了它们各自的语法和特性,并通过两个html网页设计的练习,感受一下它们给我们开发者在进行css网页布局过程中带来的便利.下面是我对它们之间的区别的一些总结. Less和Sass的相同之处: 1.变量:可以单独定义一系列通用的样式,在需要的时候进行调用. 2.混合(Mixins):class中的class(讲一个class引入到另一个class,实现class与class之间的继承),还可以带参数的混合,就像函数一样. 3.嵌套:class

动态样式语言Sass&Less介绍与区别

一. Sass/Scss&Less是什么? Sass (Syntactically Awesome Stylesheets)是一种动态样式语言,语法跟css一样(但多了些功能),比css好写,而且更容易阅读.Sass语法类似与Haml,属于缩排语法(makeup),用意就是为了快速写Html和Css. Less一种动态样式语言. 将CSS赋予了动态语言的特性,如变量,继承,运算, 函数. LESS 既可以在客户端上运行 (支持IE 6+, Webkit, Firefox),也可一在服务端运行 (

LESS与SASS

LESS和Sass在语法上有些共性,比如下面这些: 混入(Mixins)——class中的class: 参数混入——可以传递参数的class,就像函数一样: 嵌套规则——Class中嵌套class,从而减少重复的代码: 运算——CSS中用上数学: 颜色功能——可以编辑颜色: 名字空间(namespace)——分组样式,从而可以被调用: 作用域——局部修改样式: JavaScript 赋值——在CSS中使用JavaScript表达式赋值. LESS和Sass的主要不同就是他们的实现方式,LESS是

Sass入门——简介+语法格式及编译调试

本文来自慕课网大漠. Sass简介 Sass和SCSS区别 1.后缀名不同,很好理解 2.Sass以严格的缩进语法规则书写,不带大括号和分号:而SCSS的语法规则和CSS的语法很类似. Sass: $font-stack: Helvetica, sans-serif //定义变量 $primary-color: #333 //定义变量 body font: 100% $font-stack color: $primary-color SCSS: $font-stack: Helvetica, s

Less、Sass/Scss

CSS 预处理器是一种专门的编程语言,进行Web 页面样式设计,然后再编译成正常的CSS 文件,以供项目使用.CSS 预处理器为CSS 增加一些编程的特性,无需考虑浏览器的兼容问题. 在CSS 中使用变量.简单的逻辑程序.函数等等在编程语言中的一些特性,可以让CSS 更加简洁.适应性更强.可读性更佳,更易于代码的维护等诸多好处. 官网描述: Sass 是一门高于CSS 的元语言,它能用清晰地.结构化地描述文件样式,有着比普通CSS 更加强大的功能. Sass 能够提供更简洁.更优雅的语法,同时提

sass/scss 和 less的区别

转自:孤舟蓑翁 的博客http://www.cnblogs.com/wangpenghui522/p/5467560.html 高级程度排名: SASS (变量+混入+继承+函数+条件判断+嵌套+for+if+工具库Compass) >  SCSS (变量+混入+继承+函数+条件判断) > LESS (嵌套+变量+混入) > CSS (纯静态) 一. Sass/Scss.Less是什么? Sass (Syntactically Awesome Stylesheets)是一种动态样式语言,