【css预处理器】css预处理器及sass基本介绍

001、什么是css预处理器?

css预处理器定义了一种新的语言。用一种专门的编程语言,为css增加了一些编程的特性,将css作为目标生成文件,然后开发者就只要使用这种语言进行编码工作。(通俗点说“”css预处理器用一种专门的编程语言,进行web页面样式设计,然后在编译成正常的css文件,以供项目使用“”)

 


 

002、css预处理器的优点

css预处理器为css增加一些编程的特性,无需考虑浏览器的兼容性问题。如在css中使用 变量、简单的逻辑程序、函数。可以让你的css更加简洁、适应性更强、可读性更佳、更易于代码的维护


 

003、什么是sass?

sass是一门高于css的元语言。它能清晰的、结构化的描述文件样式,有着比普通css更加强大的功能。sass能够提供更简洁、更优雅的语法,同时提供多种功能来创建可维护和管理的样式表。
 
sass是采用Ruby语言编写的一款css预处理语言
 

004、sass和scss有什么区别?
 
sass和scss其实是同一种东西,我们平时都称之为sass,两者之间不同之处有以下2点。
1、文件扩展名不同,sass是以sass为后缀为扩展名,而scss是以.scss后缀为扩展名。
2、语法书写方式不同,sass是以严格的缩进语法规则来书写,不带大括号({})和分号(;),而scss的语法书写我们的css语法书写方式非常类似
 
【css预处理器】css预处理器及sass基本介绍
//scss写法
$width:300px;
$height:400px;

body{
     width:$width;
     height:$height;
}


//sass写法
$with:100px;
$height:100px;

body
     width:$width 

【css预处理器】css预处理器及sass基本介绍

上一篇:css 背景图片路径问题


下一篇:.NET ----- 控制文本框只能输入数字,并将文本框改成下划线