指定css变量的单位



是否可以将单位类型分配给CSS属性内部的CSS变量?

:root {
--width: 400;
}
.class {
width: var(--width); //assign 'px' as unit?
}

您可以通过将没有px值的var乘以1px来使用calc()函数来做到这一点,例如:

因为这将在最后将值转换为px
我搜索了很多,但我认为没有办法将px添加到var而没有calc()

:root {
--width: 200;
}
div.a {
width: calc(var(--width) * 1px);
border: 1px solid black; 
}
<body>
<h1>Test</h1>
<div class="a">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit. Vestibulum volutpat tellus diam, consequat gravida libero rhoncus ut. Maecenas imperdiet felis nisi, fringilla luctus felis hendrerit sit amet. Pellentesque interdum, nisl nec interdum maximus, augue diam porttitor lorem, et sollicitudin felis neque sit amet erat.</div>
</body>

最新更新