Mixin để chuyển từ đơn vị px qua em trong Less, ta viết như sau
.px2em(@selector, @target, @context = 16px) { @{selector}: (@target / @context) + 0em; }
Ứng với:
- @selector: là thuộc tính cần áp dụng, ví dụ (font-size, margin-top…)
- @target: là giá trị px cần chuyển đổi sang em
- @context: là ngữ cảnh font-size hiện tại làm 1em bằng 16px.
Sử dụng:
.serviceContainer { .px2em(font-size, 18px) }
Nội dung less trên sẽ được chuyển qua css:
.serviceContainer { font-size: 1.125em; }