Question

我有一个LESS样式规则应该适用于宽度和高度值相等的元素。
该值应该是元素父级宽度的3％。
这是我迄今为止通过JavaScript评估和一点jQuery所做的：左

element {
    @var: ~`Math.round(($(parent).width()*3)/100)+"px"`;
    width: @var;
    height: @var;
}

所以我的问题是：在LESS中是否有任何本地方式，所以我可以在没有JavaScript的情况下实现这一目标？提前谢谢。

Answer 1

在我看来，根本没有理由使用javascript - 我会直接使用css并为我想要只有3％的父母的所有元素添加一个类 - 像这样：

.threepercent{
  height:3%;
  width:3%;
}

Answer 2

只要您的元素为block级别，您就可以只是百分比。如果它不起作用，您的元素可能是inline。

parent-element {
    display: block;
    width: 300px;
    height: 300px;
}

parent-element element {
    display: block;
    width: 3%;  // will be 10px
    height: 3%; // will be 10px
}

或

@parentSize: 300px;

parent-element {
    display: block;
    width: @parentSize;
    height: @parentSize;
}

child-element {
    display: block;
    width: @parentSize* 0.03;
    height: @parentSize* 0.03;
}

LESS和jQuery的宽度和高度相等

2 个答案: