css预编译器,是基于css语言的,能够让css也能有一种编程语言规范,从而,解决了css的诸多问题,如css模块化、无法嵌套书写、没有变量。
css 预编译器
CSS 预处理器定义了一种新的语言,其基本思想是,用一种专门的编程语言,为 CSS 增加了一些编程的特性,将 CSS 作为目标生成文件,然后开发者就只要使用这种语言进行编码工作。
CSS 预处理器为 CSS 增加一些编程的特性,无需考虑浏览器的兼容性问题”,例如你可以在 CSS 中使用变量、简单的逻辑程序、函数(如右侧代码编辑器中就使用了变量$color)等等在编程语言中的一些基本特性,可以让你的 CSS 更加简洁、适应性更强、可读性更佳,更易于代码的维护等诸多好处。
目前主流的预处理器里最常用的三种有:Sass,Less ,Stylus 。
css 预编译器从下面几个方面提升了css的开发效率:增强编程能力;
增强可复用性;
增强可维护性;
更便于解决浏览器兼容性
预编译器的原理:
CSS预编译的工作原理是提供便捷的语法和特性供开发者编写源代码,随后经过专门的编译工具将源码转化为CSS语法。最早的CSS预编译器是2007年起源于Ruby on Rails社区的SASS,目前比较流行的其他CSS预编译器如Less、Stylus的诞生都一定程度上受到了SASS的影响和启发。
不同的预编译器特性虽然有所差异,但核心功能均围绕这些目标打造,比如:嵌套;
变量;
mixin/继承;
运算;
模块化;嵌套是所有预编译器都支持的语法特性,也是原生CSS最让开发者头疼的问题之一;
mixin/继承是为了解决hack和代码复用;
变量和运算增强了源码的可编程能力;
模块化的支持不仅更利于代码复用,同时也提高了源码的可维护性。
更多web前端开发知识,请查阅 HTML中文网 !!