Saturday, 16 January 2016

Sass & Compass : Lupakan tentang vendor prefixes

Saya penggemar CSS3, Ini memungkinkan kita melakukan lebih banyak hal dengan CSS dari pada sebelumnya. Bagaimanapun juga, penerapan ini adalah feature baru (background gradients, box-shadows, transformation dan sedikit lebih), seringkali masih dalam feature percobaan, sering meminta menggunakan vendor prefixes dan kadang berbeda syntax. Sebagai contoh, ini adalah secara sejarah telah dibutuhkan untuk rounded corner :

.rounded {
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
}


Dengan Sass's authoring framework, Compass, kita dapat menumpuk dari gratis mixin (jangan takut tentang apa itu mixin, kita akan mengetahuinya dalam waktu dekat). Sebaliknya ingat prefixes dan associated syntax, anda dapat hanya menulis code berikut :

.rounded {
@include border-radius(4px);
}


Dan itu akan menghasilkan tepat CSS yang sama pada saat setelah compile, semua vendor prefixes mendapatkan secara otomatis dihasilkan. Sebuah penghematan waktu yang besar.

No comments:

Post a Comment