html - 什么是 Less 文件？

Question

我最近开始研究 React图书馆。在我要处理的整个代码库中，我看到 *.less 文件，其中包含与样式相关的类，就像我们过去在 HTML/JavaScript 页面的 CSS 文件中一样。

.less 文件与传统的 CSS 样式表有何不同？我们还可以将 *.css 文件与 *.JSX 文件一起用于样式目的吗？

Answer 1

Less基本上是一种类似 CSS 的语言，具有可以使用预处理器编译为 CSS 的附加功能。

这些附加功能的示例是:

变量定义。假设您在网站/应用程序上有一个配色方案，并且需要继续重复使用相同的颜色，您可以将该颜色存储在一个变量中并在任何地方继续使用它(而不是必须记住十六进制代码)。

    @nice-blue: #5B83AD;

    #header {
      color: @nice-blue;
    }

假设稍后您想要更改颜色，您可以简单地更改变量，而不是遍历所有 CSS 并手动更改。

还有其他简洁的东西，如循环等。您可以查看 their documentation获取更多信息。

您可以查看的另一个流行的预处理器是 Sass .