Arkadaşlar bu yazımızda css de tarayıcılar için prefix tanımları ve bu tanımlamalara neden ihtiyaç olduğunu anlatacağız.
Web tarayıcıların geliştiricileri farklı firmalar ve tarayıcı görüntüleme motorlarının geliştiricileri farklı olduğu için farklılıklar oluşabiliyor. Bundan dolayı CSS prefix ( önek ) tanımlama ihtiyacı olabiliyor. Bu ihtiyaç bazı kodlarda oluyor. İlerleyen derslerimizde bu kodları anlatırken bahsedeceğiz.
Tarayıcıların CSS prefix tanımları:
Google Chrome | -webkit- |
Yandex Browser | -webkit- |
Safari | -webkit- |
İnternet Explorer | -ms- |
Microsoft Edge | -ms- |
Microsoft Office | -mso- |
Mozilla Firefox | -moz- |
Opera | -o- |
CSS önek tanımları için W3C tarafından bir sıralama verilmiştir. Bu sıralama ile yazılmazsa hatalı olmaz ama kriter olarak vermişlerdir.
W3C sıralaması
- -webkit-
- -moz-
- -o-
- -ms-
- -mso-
- standart kodlama
Burada örnek olması için bir Css değeri için yazalım. “border-radius:5px;” yazmak yerine kod kısmında prefix tanımlarını ekleyerek yazıyoruz. Örnek kod:
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-o-border-radius: 3px;
-ms-border-radius: 3px;
border-radius: 3px;
Yukarıdaki kodlarda W3C deki sıralama mantığına göre yazdık. Sıra ile tarayıcı öneklerini yazıyoruz ve en son standart kodun kendisini yazıyoruz. Bu sıralama ile yazmasak da karışık yazsak yine çalışmasında problem olmaz.
Başka bir yazımızda buluşmak dileğiyle…