LESS（Leaner CSS）是一种预处理器语言，扩展了 CSS 语言，用于帮助开发者更加灵活、高效、方便地编写 CSS 样式。LESS 最近发布了新的版本，其中包含了许多新的功能和语法，本篇文章将会详细介绍这些新的变化，并提供示例代码和指导意义。
变量声明方式改进
在 LESS 3.0 之前，变量的声明方式为 @name: value，需要使用 @name 来代替 value，以使用这个变量。在新的版本中，你可以直接使用 value 来代替变量的名称。这种方法被称为“内联变量声明”（Inline Variable Declaration），它简化了代码。
-- -------------------- ---- ------- -- ---- --- ------- -------- ---- - ----------------- ------- - -- ---- --- ---- - ----------------- -------- -
操作符增强
在 LESS 3.0 中，操作符 +、-、* 和 / 均被增强，可以直接进行颜色值的运算。
-- -------------------- ---- ------- -- ---- --- -------- -------- -------- -------- -------- ------------ -------- ----- -- ---- ------------- -------- -------- -------- -------- -------- ------- - --------
Nesting Selector 优化
在 LESS 中，Nesting Selector 可以让规则嵌套在另一个规则内部。在新版本中，这个特性被进一步优化，使得嵌套更加方便和易读。
-- -------------------- ---- -------
-- ---- ---
---------- -
---- -
------- -----
-
-
-- ---- ---
---------- -
---- -
------- -----
------- -
----------------- --------
-
-
-其他增强
LESS 3.0 还增加了更多的特性，包括：
guard function：如果变量不存在则报错。default function：变量不存在时返回默认值。extend：允许类似继承的复用 CSS 规则。
总结
LESS 新版本的增强让开发者更加方便地编写 CSS 样式，大大提高开发效率。与旧版本相比，我们可以更加简洁地声明变量、使用操作符和嵌套选择器，同时利用新的特性进一步优化 CSS 代码。建议开发者尽快升级 LESS 到最新版本，并结合示例代码体验新的特性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/647307b8968c7c53b008e793
