LESS 面试题

以下是一些最常问的LESS 面试问题及答案。

1) 什么是 Less？

Learner Style Sheet (Less) 是一种向后兼容的语言，可以编译成 Cascading Style Sheet (CSS)，并在客户端和服务器端运行。它是一种开源语言，并且跨浏览器兼容。

2) Less 编程语言是什么时候发明的？

Less 编程语言最早发明于 2009 年。

3) Less 最初是用哪种语言编写的？

LESS 最初于 2009 年用 Ruby 编写。

4) Less 当前使用的语言是什么？

目前，Less 使用 JavaScript。

5) Less 的发明者是谁？

Less 由 Alexis Sellier 和 Dmitry Fadeyev 设计和开发。

6) Less 文件的扩展名是什么？

Less 文件的扩展名是 ".less"。在 Less 文档文件中，始终需要使用 ".less" 扩展名。

7) 有多少种方式可以使用 Less？

有三种方式可以使用 Less：

• 通过命令行。
• 通过第三方工具。
• 您可以下载 Less 作为脚本文件在浏览器中使用。

8) 如何在 Less 中表示变量？

变量需要用 @ 符号声明，并使用冒号 (:) 来分配变量的特定值。在变量值之后也必须添加分号 (;)。

例如

在上面的 Less 示例中，Less 编程中使用的两个变量的值分别为 #FF7F50 和 #800080。

9) Mixins 在 Less 中有什么作用？

在 Less 中，Mixins 允许您将一组属性从一个规则集添加到另一个规则集中。它将类名作为其属性。Mixins 可以像 CSS 样式一样，使用类或 ID 选择器进行声明。它可以存储多个值，并在需要时在代码中重用。

语法

10) Less 编程中嵌套的作用是什么？

嵌套用于使代码简洁、干净、更简单，因为它允许遵循一定的视觉层次结构。例如，在 Less 编程中可以进行类的嵌套。

例如

在上面的 Less 文档嵌套示例中，myclass 是 container 类的子类。

11) Less 中的颜色通道函数有哪些？

在 Less 中，颜色通道函数是内置函数，用于根据颜色定义设置某个通道的值。HSL 颜色包括色相、饱和度和亮度通道，RGB 颜色包括红色、绿色和蓝色通道。

12) LESS 中数据 URI (Uniform Resource Identifier) 的作用是什么？

借助 Data URI，可以将图像直接嵌入到样式表中。

13) "Source Map Less Inline" 选项代表什么？

"Source Map Less Inline" 选项表示所有 CSS 文件都必须包含在源映射中。

14) Less 和 SASS 有什么区别？

15) Less 和 Sass 有哪些相似之处？

以下是 Less 和 Sass 之间的相似之处：

• 命名空间在两者中都相似。
• 颜色函数在两者中都相同。
• 嵌套功能在两者中都相同。
• JavaScript 评估在两者中都相同。

16) Less 中的 & combinator 是什么？

在 LESS 中，& combinator 用于将嵌套选择器与父选择器组合。

17) Less 是否支持运算？

是的，Less 支持各种算术运算，如 +, -, *, /，可以对任何颜色或变量进行操作。

18) Escaping 在 Less 中的作用是什么？

当需要执行具有无效语法的 CSS 文件时，可以使用 Escaping。

19) 有没有可以替代 Less 的选择？

是的，有各种其他选择可以替代 Less，例如 SCSS、stylus。

20) 如何通过命令行调用 Less 编译器？

要调用编译器，请遵循以下命令：

1. $ Lessc styles.Less

21) e() 函数在 Less 中的作用是什么？

e() 函数的作用是转义 Less 编译器中的值。

22) 如何在 Less 中创建循环结构？

当递归 Mixins 与模式匹配和守卫表达式结合时，可以创建各种迭代/循环结构。

23) 如何将 Less 预编译为 CSS 的最佳方法是什么？

将 Less 预编译为 CSS 最简单的方法是使用 Node.js 中的 Less.js，其中 Less.js 在浏览器之外运行。

24) Namespaces 和 Accessors 在 Less 中有什么作用？

Namespaces 用于将 Mixins 分组到公共名称下。您可以借助 Less 文件中的 Namespaces 和 Accessors 进行封装。

例如

25) 在 LESS 编程语言中，定义变量的上下文范围。

变量的范围是指变量存在的位置。变量首先在局部作用域中搜索。如果不在局部作用域中，编译器会在父作用域中搜索。

例如

在上面的 Less 文档中，变量 a 在类中定义，值为 20，而具有相同名称的变量也在类外定义，值为 15。当编译器执行此 Less 文档时，它首先搜索局部作用域。因此，使用了变量的局部作用域。编译过程完成后，创建的 CSS 文件具有 20px 的 font-size 值。

26) 什么是注释？

注释是指一些文本，人类可以理解这些文本以了解复杂代码在编程中的工作原理。

27) 编译器对注释的反应是什么？

编译器对注释的反应是无。编译器在编译代码时会忽略注释。

28) 在 Less 文档中有多少种类型的注释？

Less 文档允许两种类型的注释：单行注释和块注释。但是，如果您在代码中编写单行注释，编译器会忽略它，并且不会将该代码添加到 CSS 文件中。只有块注释会被添加到 CSS 文件中。

29) Less 中导入的作用是什么？如何实现？

导入用于将 CSS 或 Less 文档导入到 Less 文档中。导入可以通过在 Less 文档的开头包含 "@import" 和 CSS 或 Less 文件的地址来完成。

30) extend 在 Less 中的作用是什么？

extend 是 Less 的伪类，用于在一个选择器中选择另一个选择器的样式。

例如

在上面的 extend 示例中，style 类属性已导入到 h2 的属性中。

31) Less 中有哪些不同类型的函数？

Less 中的函数类型列表如下：

• 杂项函数
• 字符串函数
• 列表函数
• 数学函数
• 类型函数
• 颜色定义函数
• 颜色通道函数
• 颜色运算
• 颜色混合函数