Mixin Để Chuyển Từ Đơn Vị px Qua em Trong Less

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:

  1. @selector: là thuộc tính cần áp dụng, ví dụ (font-size, margin-top…)
  2. @target: là giá trị px cần chuyển đổi sang em
  3. @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;
}

 

Rate this post

You May Also Like

About the Author: truongluu

Leave a Reply

Your email address will not be published. Required fields are marked *