CSS3 optimieren

[Malcolm Beck´s]

مرحبا

Hallo, gibt es eine Möglichkeit folgenden CSS Code zu optimieren.
Muss ich wirklich jeden Browser-Type separat anlegen?!?

@-moz-keyframes scale_ani1 {
0%   { -moz-transform: scale(1,1); }
10%  { -moz-transform: scale(0.95,0.95); }
90%  { -moz-transform: scale(0.95,0.95); }
100% { -moz-transform: scale(1,1);  }
}

Für sowas eignet sich Sass oder Less sehr gut. Mit einem Mixin könntest du das bspw. vereinheitlichen und leichter pflegen.

Ohne es getestet zu haben:

@mixin scale($browser) {  
0%   { -{$browser}-transform: scale(1,1); }  
10%  { -{$browser}-transform: scale(0.95,0.95); }  
90%  { -{$browser}-transform: scale(0.95,0.95); }  
100% { -{$browser}-transform: scale(1,1); }  
}  
  
/*  
  Und so rufst du es auf  
*/  
@-moz-keyframes scale_ani1 {  
  @include scale('moz');  
}  
@-webkit-keyframes scale_ani1 {  
  @include scale('webkit');  
}

mfg