首页前端开发CSSsass与scss之间的区别是什么

sass与scss之间的区别是什么

时间2024-05-21 06:08:03发布访客分类CSS浏览43
导读: 它是来自另一个名为Haml的预处理器,受Haml的简洁启发,是由Ruby开发人员设计和编写的,因此,Sass样式表使用类似Ruby的语法。没 sass适用于那些喜欢与CSS相似的简洁性的人。它使用行的缩进来指定块,而不是括号和分号...
  它是来自另一个名为Haml的预处理器,受Haml的简洁启发,是由Ruby开发人员设计和编写的,因此,Sass样式表使用类似Ruby的语法。没   sass适用于那些喜欢与CSS相似的简洁性的人。它使用行的缩进来指定块,而不是括号和分号,因此有括号,没有分号和严格的缩进。sass语法中的文件使用扩展名.sass。   例:   //Variable   !primary-color=hotpink   //Mixin   =border-radius(!radius)   -webkit-border-radius=!radius   -moz-border-radius=!radius   border-radius=!radius.my-element   color=!primary-color   width=100%   overflow=hidden.my-other-element   +border-radius(5px)   正如我们所看到的,与常规CSS相比,这是一个相当大的变化!变量标志是"!"不"$",分配符号"=",而不是":",这样有点奇怪!   但这是Sass在2010年5月3.0版到来之前的样子,之后SassyCSS引入了一种名为scss的全新语法。这种语法旨在通过引入CSS友好语法来缩小Sass和CSS之间的差距。   scss,类似与CSS的语法,完全符合CSS标准,      //Variable   $primary-color:hotpink;   //Mixin   @mixinborder-radius($radius){   -webkit-border-radius:$radius;   -moz-border-radius:$radius;   border-radius:$radius;   }   .my-element{   color:$primary-color;   width:100%;   overflow:hidden;   }   .my-other-element{   @includeborder-radius(5px);   }   scss绝对比sass更接近CSS。







本文转载自中文网

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!


若转载请注明出处: sass与scss之间的区别是什么
本文地址: https://pptw.com/jishu/664677.html
CSS中background什么意思? css计数器如何实现自动嵌套编号

游客 回复需填写必要信息