吞噬CSS的方式來分離構建期間的字體速記？

Question

在構建過程中是否將css字體解析爲其獨立部分？

所以

font:500 3em/1.2 Arial, sans-serif; 

到

font-weight: 500; 
font-size: 3em; 
line-height: 1.2; 
font-family: Arial, sans-serif; 

Answer 1

CSS本身並不做解析。有內置的快捷鍵，但它們是您允許使用的唯一捷徑。你不能單獨在CSS中編寫你自己的代碼。

如果您正在使用像SCSS解析語言，您可以編寫自己的函數來爲你做的：

@mixin my_font_function($weight, $size, $height, $family) { 
    font: { 
     weight: $weight; 
     size: $size; 
     family: $family; 
    } 
    line-height: $height; 
} 

那麼這樣的：

div.class{ 
    @include my_font_function(500, 3em, 1.2, "Arial, sans-serif"); 
} 

會產生：

div.class { 
    font-weight: 500; 
    font-size: 3em; 
    line-height: 1.2; 
    font-family: Arial, sans-serif; 
} 

一旦編譯完成。