什么是多重选择器
多重选择器是指在 CSS 中通过一个选择器同时选中多个元素或类，以便于对它们进行相同或类似的样式设置。在 LESS 中，我们可以使用嵌套语法来创建多重选择器。
LESS 嵌套语法
LESS 是一个 CSS 预处理器，它提供了许多方便的语法来简化 CSS 的编写。其中嵌套语法就是其中之一。它类似于编程中的嵌套语句，可以让我们更方便地管理和组织 CSS 代码。
LESS 的嵌套语法共有两种形式：
嵌套规则
-- -------------------- ---- -------
--- -
-- -
------- --
-------- --
----------- -----
-
-- -
-------- -------------
-
-上面的代码中，我们通过嵌套规则来选择 nav 元素下的 ul 和 li 元素，并对它们进行样式设置。这样的好处是能够更加清晰地表现页面结构，减少代码量，方便后期维护。
嵌套属性
-- -------------------- ---- -------
--- -
-- -
-- -
----- -
------- -----
----- -----
-
-
-
-上面的代码中，我们使用了嵌套属性来设置 li 元素的字体大小和粗细。这样的方式可以避免重复书写属性名，提高效率。
使用嵌套语法创建多重选择器
使用 LESS 的嵌套语法可以很方便地创建多重选择器。我们可以将多个选择器嵌套在一起，用逗号隔开。
-- -------------------- ---- -------
--- --- --- --- --- -- -
------------ -------
------------ ----
-
-- --- -- -
---------- -----
------ -----
-
-- ------ -
------ ----
------- -
------ -----
-
-上面的代码中，我们通过嵌套语法创建了三个多重选择器。第一个是针对标题的样式设置，第二个是针对文本的样式设置，第三个是针对链接和按钮的样式设置，并通过嵌套选择器设置了鼠标悬停时的颜色。
总结
使用 LESS 的嵌套语法可以帮助我们更方便地管理和组织 CSS 代码，特别是在创建多重选择器时更为方便。通过上面的代码示例，我们可以看到它们是如何使用的。在实际项目中，我们可以结合页面结构和设计需求，灵活地使用嵌套语法来优化我们的 CSS 代码。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/646b0ceb968c7c53b0a7dffa