简体   繁体   English

在更少的CSS中,是否有一种方法可以将选定的Elments ID或类传递给Mixin?

[英]In less css is there a way to pass in a selected elments id or class into a mixin?

.w(@w, @h){
    width: (@widget-w * @w) + (@widget_margin_right * @w);
    height: (@widget-h * @h) + (@widget_margin_bottom * @h);
} 
[class*='w_']{
    .w(1,1);
}

So in this I have html elements with a class that determines the width and height of the element. 因此,在此,我拥有带有确定该元素的宽度和高度的类的html元素。 Like so.... And this div is going to be @widget-w = 228px; 像这样...。这个div将是@ widget-w = 228px; @widget-h = 194px; @ widget-h = 194px;

Now I had it like this .w_1x1{ .w(1,1); 现在我有了这样的.w_1x1 {.w(1,1); } .w_2x1{ .w(2,1); } .w_2x1 {.w(2,1); } But I'd like it more automated to fit for any size i want at any time So i'm trying to make a mixin that i can pass into the class name to simplify it. }但是我希望它可以更自动化地适应我想要的任何大小,因此我正在尝试制作一个mixin,以便可以将其传递给类名以简化它。

I believe you would have to do that with javascript/jquery. 我相信您必须使用javascript / jquery来做到这一点。 LESS is great for calculations, but it's compiled BEFORE the page is laid out. LESS非常适合计算,但是它是在页面布局之前进行编译的。

In other words, it would not be able to dynamically pull the height or width unless it ran the compiled CSS after the page had already rendered and been styled. 换句话说,除非页面已经呈现并设置样式后运行了已编译的CSS,否则它将无法动态拉动高度或宽度。

So that is a no. 所以那不是。


Some extra info: 一些额外的信息:

LESS is a CSS preprocessor, which means it is designed to process before the browser loads anything on the page. LESS是CSS预处理程序,这意味着它可以在浏览器将任何内容加载到页面之前进行处理。 Hopefully, you're using a compiler to compile your LESS into CSS, and not compiling client side (which is not recommended). 希望您正在使用编译器将LESS编译为CSS,而不是编译客户端(不建议这样做)。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM