Nədirlər və niyə istifadə etməli?
CSS bazarı və ya CSS tarayıcısı önekləri olan CSS satıcılarının önekləri, bu xüsusiyyətlər bütün brauzerlərdə tam dəstəklənməmişdən əvvəl brauzerlərin yeni CSS funksiyalarına dəstək vermək üçün bir vasitədir. Bu, brauzer istehsalçısı bu yeni CSS funksiyalarının necə tətbiq ediləcəyini dəqiqləşdirən bir növ test və sınaq müddətində edilə bilər. Bu prefiks bir neçə il bundan əvvəl CSS3 artımı ilə çox məşhur olmuşdur.
CCS3 ilk dəfə tətbiq edildikdə müxtəlif həyəcanlı xüsusiyyətlər fərqli zamanlarda fərqli brauzerləri vurmağa başladı. Örneğin webkit-powered brauzerlər (Safari və Chrome) ilk növbədə transformasiya və keçid kimi animasiya tərzi xüsusiyyətlərini təqdim edir. Satıcıdan əvvəlcədən təyin edilmiş xüsusiyyətləri istifadə edərək, veb-dizaynerlər bu yeni xüsusiyyətləri öz işlərində istifadə edə bilirdilər və onları hər hansı digər brauzer istehsalçısını tutmaq üçün gözləməli olmaları əvəzinə onları dəstəkləyən brauzerlərdə görmüşlər!
Beləliklə, bir ön uç web geliştiricisi baxımından brauzer önekləri brauzerlərin həmin üslubları dəstəkləyəcəyini bildiyinə əmin olduqları bir site üzərində yeni CSS xüsusiyyətləri əlavə etmək üçün istifadə olunur. Müxtəlif brauzer istehsalçıları xüsusiyyətləri bir az fərqli şəkildə və ya başqa bir sintaksis ilə tətbiq edərkən xüsusilə faydalı ola bilər.
CSS tarayıcınızın istifadə edə biləcəyiniz önekləri (hər biri ayrı bir brauzerə özgü) aşağıdakılardır:
- Android: -webkit-
- Chrome: -webkit-
- Firefox: -moz-
- Internet Explorer: -ms-
- iOS: -webkit-
- Opera: -o-
- Safari: -webkit-
Çox hallarda, yeni CSS stil mülkiyyətindən istifadə etmək üçün standart CSS xüsusiyyətini götürün və hər bir brauzer üçün prefiks əlavə edin. Prefixed versiyaların hər zaman ilk dəfə (istədiyiniz hər hansı qaydada) normal CSS mülkiyyəti sona çatacaqdır. Məsələn, sənədinizə CSS3 keçidini əlavə etmək istəyirsinizsə, keçid mülkiyyətini aşağıda göstərildiyi kimi istifadə edin:
-webkit- keçid: bütün 4s asanlıqla;
-moz- keçid: bütün 4s asanlıqla;
-s- keçid: bütün 4s asanlıqla;
-o- keçid: bütün 4s asanlıqla;
keçid: bütün 4s asanlıqla;
Qeyd: Bəzi brauzerlər müəyyən xüsusiyyətlərə görə başqalarından fərqli bir sintaksis var, buna görə bir mülkiyyətin brauzer-prefixed versiyası standart xüsusiyyət ilə tam olaraq eyni olduğunu düşünməyin. Məsələn, CSS gradient yaratmaq üçün lineer-gradient xüsusiyyətindən istifadə edirsiniz. Firefox, Opera və Chrome və Safari-nin müasir versiyaları, mülkiyyəti müvafiq prefikslə istifadə edir, Chrome və Safari'nin erkən versiyaları əvvəlcədən təsvir edilmiş əmlakı -webkit-gradienti istifadə edir. Ayrıca, Firefox standart dəyərlərdən fərqli dəyərlər istifadə edir.
CSS-nin mülkiyyətinin normal, qeyri-prefiksiyalı versiyası ilə həmişə bəyanatınızı sona yetirən səbəb budur ki, bir brauzer qüvvəyə dəstək verərsə, ondan istifadə edəcəkdir. CSS-nin necə oxunacağını xatırlayın. Daha əvvəlki qaydalar əvvəlki hallarda üstünlük təşkil edirsə, spesifiklik eynidır, buna görə brauzer bir qayda üzrə satıcı versiyasını oxuyacaq və normal bir şeyi dəstəkləməzsə istifadə etməlidir, ancaq bir dəfə tətbiq olunduqdan sonra satıcı versiyasını faktiki CSS qayda.
Satıcı Prefiksləri Hack deyil
Satıcı prefiksləri ilk dəfə təqdim edildikdə, bir çox veb peşəkarları hack və ya müxtəlif brauzerləri dəstəkləmək üçün bir web saytının kodunu çəkərək qaranlıq günlərə qayıtdıqlarını (" Bu sayt ən yaxşı İE " mesajlarını yadda saxla) xatırladı. CSS satıcılarının ön kodları hacks deyil, və işinizdə istifadə etmək üçün heç bir ehtirasınız olmur.
CSS hack başqa bir əmlakın düzgün işləməsi üçün digər element və ya əmlakın həyata keçirilməsində qüsurları yaradır. Məsələn, qutu modeli səs-ailə mülkiyyətinin ayrılmasında və ya brauzerlərin sətirlərini (\) necə təhlil etdiyində istismar edilən qüsurları yaradır. Ancaq bu boşluqlar, Internet Explorer 5.5'ün qutu modelini necə işlədiyini və Netscape'in necə şərh etdiyinin və səs ailə üslubu ilə əlaqəsi olmayan arasındakı fərqin problemini həll etmək üçün istifadə edildi. Xoşbəxtlikdən bu iki köhnə brauzer bu günlərdə özümüzü narahat etməyənlərdir.
Bir satıcı prefiksi bir hack deyil, çünki spesifikasiyanın əmlakın necə tətbiq oluna biləcəyi qaydalarını qurmasına imkan verir, eyni zamanda brauzerlərin hər bir şeyi qırmadan başqa bir əmlak tətbiq etməsinə imkan verir. Bundan əlavə, bu önekarlar, CSS xüsusiyyətləri ilə işləyir , nəticədə spesifikasiyanın bir hissəsi olacaqdır . Mülkiyyəti erkən əldə etmək üçün sadəcə bəzi kodlar əlavə edirik. CSS qaydasını normal, qeyri-prefixed əmlakı ilə bitirmək üçün başqa bir səbəbdir. Tam brauzer dəstəyi əldə edildikdən sonra əvvəlcədən quraşdırılmış versiyaları buraxa bilərsiniz.
Brauzerin müəyyən bir xüsusiyyət üçün hansı dəstək olduğunu bilmək istəyirsiniz? CanIUse.com veb-saytı bu məlumatı toplamaq və brauzerlərin hansı versiyasını və hazırda hansı xüsusiyyətləri dəstəkləyəcəyini bilmək üçün gözəl bir qaynadır.
Vendor Prefiksləri müvəqqəti, ancaq narahatdır
Bəli, bütün brauzerlərdə işləmək üçün əmlakı 2-5 dəfə yazmaq üçün zəhlətökən və təkrar hiss edə bilər, ancaq müvəqqəti vəziyyətdir. Məsələn, bir neçə il bundan öncə yazmaq üçün bir qutuya yuvarlaq bir künc qoymaq üçün:
-moz-sərhəd radius: 10px 5px;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 5px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 5px;
sərhəd radius: 10px 5px;
İndi bu brauzerlər bu xüsusiyyətə tam dəstək vermək üçün gəlmişlər, həqiqətən, yalnız standart versiyaya ehtiyacınız var:
sərhəd radius: 10px 5px;
Chrome 5.0-ci ildən CSS3 mülkiyyətini dəstəklədi, Firefox 4.0 versiyasına əlavə etdi, Safari 5.0, Opera 10.5, 4.0-də iOS və 2.1-də Android-yə əlavə etdi. Hətta Internet Explorer 9 bir prefiks olmadan dəstəkləyir (və IE 8 və daha aşağı dəstəkləməmiş və ya önizləmədən).
Brauzerlərin hər zaman dəyişdirilməsi və ən müasir metodların arxasında olan veb səhifələr yaratmağı planlaşdırmadığınız halda, köhnə brauzerləri dəstəkləmək üçün yaradıcı yanaşmaların tələb olunacağını unutmayın. Sonda, brauzer yazılarını yazmaq, daha çox gələcək versiyada müəyyənləşdiriləcək səhvləri tapmaqdan və istismardan daha çox asandır, istifadənin başqa bir səhvini tapmaq tələb edir və s.