能否从HTML向CSS类传递值？Less中类似.mt(5)实现咨询

没错，你提到的这种在HTML类名里传递参数给Less混合宏的写法完全可行！这正是Less作为CSS预处理器的便捷特性之一。

具体实现说明： #

1. 定义带参数的Less混合宏
   你写的这段Less代码是正确的，它定义了一个接收@mpx参数的混合宏，用来设置margin-top值：

   .mt(@mpx) {
     margin-top: @mpx px;
   }
   

2. 在HTML中调用混合宏
   在HTML里直接通过class="mt(5)"的方式传递参数是有效的，浏览器能够识别带括号的类名，只要Less编译后的CSS正确生成对应的选择器：

   <div class="mt(5)"> Some text </div>
   

3. 编译后的CSS输出
   当你编译这段Less代码后，会生成对应的CSS规则，类似这样：

   .mt(5) {
     margin-top: 5px;
   }
   

   浏览器可以正常解析这个带括号的类选择器，为元素应用对应的样式。

注意事项： #

• 这种写法是Less专属的，原生CSS不支持混合宏和类名传参的功能，必须通过Less编译工具处理后才能生效。
• 如果需要更灵活的样式参数传递，现在也可以结合CSS自定义属性（变量）使用，但如果你已经在使用Less，这种混合宏的方式依然是一个简洁的选择。

内容的提问来源于stack exchange，提问作者KoboldMines