Si të konfiguroni telefonat inteligjentë dhe PC. Portali informativ

CSS3: jeta pa parashtesa. Prefikset CSS të shitësit

6 shkurt 2012 në 2:14 pasdite

CSS3: jeta pa parashtesa

  • Zhvillimi i faqes në internet

Prefikset janë një gjë e mirë. Ato ndihmojnë prodhuesit e shfletuesve të zbatojnë veçori të reja. Por jeta e zhvilluesve vetëm sa bëhet më e vështirë prej tyre. Ka shumë parashtesa, ndonjëherë ka dallime në sintaksë.

Problemi është i dukshëm. Ne kemi nevojë për një mënyrë për ta bërë më të lehtë punën me parashtesa.

Natyrisht, nuk do të ishte e mençur të ndalonit përdorimin e parashtesave. Por është mjaft e mundur që përgjegjësia për gjenerimin e tyre të zhvendoset tek mjetet që ekzistojnë posaçërisht për këtë qëllim. Unë u përpoqa të listoj opsionet e mundshme.

1. Parapërpunuesit

Thelbi i paraprocesorëve është se autori i një skedari stili mund të përdorë veçori shtesë që nuk janë në CSS, të tilla si variabla, funksione të ngjashme dhe shumë më tepër, pasi së pari ka studiuar sintaksën e paraprocesorit, dhe paraprocesori tashmë do të krijojë një stil normal. skedar, duke zëvendësuar variablat dhe kodet e tjera me vlera statike. Mundësia për të zëvendësuar kodin mund të përdoret gjithashtu për të gjeneruar automatikisht kodin ndër-shfletues me prefikse.

Paraprocesorët më të famshëm CSS janë LESS dhe SASS.

Ata janë konkurrentë të drejtpërdrejtë, megjithëse ka një ndryshim mes tyre. Të dyja mund të përdoren në anën e serverit, por LESS është gjithashtu i disponueshëm si skedar javascript, kështu që mund t'i kushtoni vëmendje të veçantë kësaj veçorie.

PAK
Ky paraprocesor ka një sintaksë që është më e thjeshtë se konkurrenti i tij. Është e mundur të përpunohen skedarët e stilit në anën e serverit, por ne jemi të interesuar tani për opsionin e punës në anën e klientit përmes një skedari javascript.

Lidhje




Përzierje
.border-radius(@radius: 3px) (
-webkit-border-radius: @radius;
-moz-border-radius: @radius;
kufiri-radius: @radius;
}

Përdorimi
#formë1(
.border-radius (10px);
}

Për të punuar me parashtesa, duhet të përdorni mixins (i njëjti kod që di se çfarë të zëvendësojë dhe ku). Ka grupe të gatshme miksesh dhe bibliotekash për CSS3
lesselements.com
github.com/jdmiller82/-lessins-
snipplr.com/view/47181/less-classes
roel.vanhintum.eu/more-less

Nuk është e nevojshme të përpiloni skedarë .less në server ose në shfletues; ju mund të merrni në vend një skedar të gatshëm CSS dhe ta përdorni atë në sit
SimpLESS është një aplikacion që përpilon automatikisht .më pak në CSS standarde. Falas për të gjitha platformat.
Less App është një aplikacion i ngjashëm, por vetëm për Mac.


Serveri përpunon skedarët SASS, kompjuteri i klientit merr një skedar .css të gatshëm

Përparësitë e paraprocesorëve:
+ Përveç parashtesave, mund të bëni shumë më tepër gjëra
+ Aftësia për të përpunuar automatikisht skedarin CSS (për shembull, kompresimi, heqja e gjërave të panevojshme)
+ Memorie normale (megjithëse LESS ruhet në memorie duke përdorur localStorage)

Disavantazhet e paraprocesorëve:
– Për versionin me javascript - varësia nga skriptet e aktivizuara në shfletues
– Kodi gjenerohet me të gjitha prefikset e mundshme, jo vetëm ato që nevojiten nga një shfletues specifik

3. Gjeneratorë

Kjo metodë përdoret tashmë nga shumë njerëz. Thjesht hapni dhe kopjoni kodin e përfunduar me parashtesa nga atje.

Kohët e fundit u përpoqa të kërkoja një gjenerator që do të shtonte automatikisht vetitë e prefiksuara në një pronë standarde që kam shkruar. Doli se ka disa opsione.

Cilat janë hakimet CSS ose prefikset e shitësit?
Nëse shfletuesi nuk e mbështet ose nuk kupton një të caktuar CSS pronë, atëherë si fillon papritmas dikush ta kuptojë këtë veti pas përdorimit të një hak?
Falë prefikseve të shitësit, prodhuesit e shfletuesve tashmë po prezantojnë eksperimentalitetin CSS3 pronat në rrezikun tuaj.

Hakimet e CSS ata janë - Prefikset e shitësit, prapashtesat e shitësit dhe mbaresat e shitësit janë parashtesa të përdorura nga prodhuesit (shitësit) e shfletuesit për vetitë eksperimentale të CSS që nuk janë miratuar ende në standard.

Prefikset e shitësit janë të përshtatura për një shfletues specifik dhe e lejojnë atë të kuptojë vetitë eksperimentale të CSS dhe në të njëjtën kohë të injorojë hyrjet e destinuara për shfletues të tjerë, d.m.th. asnjë shfletues nuk do të fillojë të kuptojë "rastësisht" një pronë që nuk është menduar për të.

Duhet mbajtur mend se pronat me prefikse të shitësit nuk përputhen me standardet dhe nuk do të kalojnë vërtetimin, megjithatë, ato mund të përdoren sepse në duart e duhura është një mjet shumë i fuqishëm. Dhe shumë studio kryesore RuNet përfitojnë nga kjo.

Përdorimi i prefikseve të shitësit (hacks) është i thjeshtë; një veti CSS është shkruar për elementin në formë të drejtpërdrejtë për shfletuesit që e kuptojnë atë. Pas saj, e ndarë me një pikëpresje, është e njëjta veti, por me parashtesa të ndryshme të shitësit për shfletues të ndryshëm. Shfletuesi nga një kod i tillë interpreton vetëm pronën që është shkruar për të dhe injoron ato të shkruara për shfletues të tjerë.

Arsyet kryesore për përdorimin e prefikseve të shitësit janë:

1. Nëse kjo veçori është projektuar vetëm për një shfletues specifik dhe nuk përshkruhet në specifikimin ose modulin CSS
2. Nëse moduli CSS të cilit i përket kjo pronë është në zhvillim e sipër nga W3C dhe nuk ka arritur ende statusin e rekomandimit të kandidatit
3. Nëse vetia zbaton vetëm pjesërisht funksionalitetin e veçorisë së përshkruar në modulin ose specifikimin CSS

Falë prefikseve të shitësve, shitësit e shfletuesit tashmë po zbatojnë veçori eksperimentale CSS3 me rrezikun e tyre.

Koduesi tashmë mund të zbatojë shumicën e veçorive të ofruara nga CSS3, duke përfshirë tranzicione dhe animacione të ndryshme pa përdorur skriptet, por duke përdorur prefikset e shitësit.

Prefikset e shitësve të shfletuesve më të zakonshëm:

Prefiksi i shitësit Prodhuesi Shfletuesi Motori i shfletuesit
-o-, -op-, -xv-Software OperaOperaPresto
-moz-Projekti MozillaFirefox, SeaMonkey, Camino, etj.Gecko
-Znj-MicrosoftInternet Explorer 8Trident
-khtml-Projekti KDESafari deri në versionin 3, Konqueror, etj.KHTML
-kit në internet-AppleSafari 3+, Google Chrome, etj.WebKit
-kabina-AppleiCabWebKit

Shembulli i shkrimit:

kufiri-radius:15px 0 15px 0; /* Vetia e vlefshme e rrumbullakimit të këndit CSS 3, vlera (numri) specifikon rrezen e rrumbullakimit */
-moz- kufiri-radius:15px 0 15px 0; /* Firefox */
-kit në internet- kufiri-radius:15px 0 15px 0; /* Safari, Chrome */
-khtml- kufiri-radius:15px 0 15px 0; /* Konqueror */

Prefikset specifike të shfletuesit

U përmend më herët se specifikimi CSS3 është një grup modulesh që gradualisht po integrohen nga prodhuesit e shfletuesve. Ndonjëherë integrimi përfshin mbështetje eksperimentale. Kjo do të thotë që ndërsa specifikimi është duke u shkruar, diskutuar dhe kritikuar në W3C, prodhuesi i shfletuesit mund të vendosë të shtojë mbështetje për disa veçori në mënyrë që t'i provojë ato në praktikë. Kohët e fundit, kjo praktikë është bërë pjesë e natyrshme e procesit dhe reagimet e marra gjatë përdorimit eksperimental shpesh përdoren për të ndryshuar specifikimet.

Nga ana tjetër, një prodhues i shfletuesit mund të dëshirojë të prezantojë një veçori eksperimentale që nuk përfshihet në asnjë standard të propozuar, por një ditë mund të arrijë një status të tillë.

Prefikset e shfletuesit shpesh futen për të ofruar një mbështetje të tillë eksperimentale për vetitë CSS, të tilla si:

– webkit – kufiri-rrezja

Një fjalë kyçe me vizë para një emri të pronës e shënon atë si punë në vazhdim, që i përket vetëm zbatimit dhe interpretimit nga shfletuesi të specifikimeve në zhvillim. Nëse vetia eksperimentale do të përfshihet në një modul të përfunduar CSS3, shfletuesi duhet të mbështesë një emër pronësie të paprefiksuar.

Çdo prodhues i shfletuesit ka prefiksin e vet, të cilin ata e përdorin për të shënuar kryesisht vetitë e tyre eksperimentale. Të gjithë shfletuesit e tjerë shpërfillin rregullat që përmbajnë parashtesa që ata nuk i njohin.

tabela 1.03 liston shfletuesit më të përdorur dhe prefikset e tyre të lidhura. Ne do të përdorim prefikset WebKit, Mozilla dhe Opera për CSS3 në shembujt në kapitujt e mëposhtëm.

Tabela 1.03. Shfletuesit më të përdorur dhe prefikset e lidhura

Nga libri Boost your website autor Matsievsky Nikolai

8.2. Disa këshilla për shfletuesit Përshpejtoni ngarkimin e faqeve në Firefox 3 Në Firefox, ju mund të rrisni shpejtësinë e ngarkimit dhe shfaqjes së faqeve, duke rritur ndjeshëm komoditetin e shfletimit në internet. Çfarë duhet të bëni për këtë: Hapni faqen e cilësimeve duke shtypur në shiritin e adresave

Nga libri Inteligjenca e Internetit [Udhëzues për Veprim] autor Yushchuk Evgeniy Leonidovich

Si të kërkoni në internet për informacione për njerëz të veçantë Në internetin në gjuhën ruse, informacioni për njerëzit mund të gjendet ose duke përdorur motorët e kërkimit ose duke përdorur drejtoritë telefonike në internet. Një pyetje futet në sistemet e informacionit, i cili duhet të përmbajë

Nga libri Programim autor Kozlova Irina Sergeevna

49. Optimizimi për modele të veçanta procesorësh Nëse një program i caktuar do të ekzekutohet në kompjuterë me modele procesori të përcaktuara rreptësisht, mund të provoni të përdorni komanda të synuara për modele të veçanta procesori.Shumë nga komandat e reja japin

Nga libri Puna në internet autor Makarsky Dmitry

Përdorimi i shfletuesve Siç është përmendur tashmë, qëllimi kryesor i një shfletuesi është të shikojë faqet e internetit, kështu që ia vlen të flasim veçmas për veçoritë e lundrimit në internet duke përdorur shfletues. Le të fillojmë me kontrollet bazë, pa të cilat nuk mundeni

Nga libri Revista Dixhitale “Computerra” Nr.12 autor Revista Computerra

Veçoritë shtesë të shfletuesve Natyrisht, aftësitë e shfletuesve të internetit nuk mbarojnë me shfletimin e faqeve dhe lëvizjen nga faqja në faqe. Programet e navigimit në internet mund të bëjnë shumë më tepër, për të cilat do të flasim tani. Për më tepër, nëse kjo nuk është e specifikuar

Nga libri Computerra PDA 03/20/2010-03/26/2010 autor Revista Computerra

Opera është kapur me shfletues të tjerë Andrey Pismenny Versioni beta i shfletuesit Opera 10.50 është i pajisur me një interpretues plotësisht të ri JavaScript. Quhet Carakan dhe është dukshëm më i shpejtë se versionet e mëparshme. Kjo do të thotë që Opera më në fund ka arritur

Nga libri XSLT autor Holzner Stephen

Opera është kapur me shfletues të tjerë Autori: Andrey Pismenny Publikuar 22 Mars 2010 Versioni beta i shfletuesit Opera 10.50 është i pajisur me një interpretues plotësisht të ri JavaScript. Quhet Carakan dhe është dukshëm më i shpejtë se versionet e mëparshme. Do të thotë se

Nga libri Rruga e Programuesit: nga 100 dollarë në 10,000 dollarë në muaj autor Nikitin Aleksandër

Transformimi i dokumenteve XML duke përdorur shfletues Mbështetja XSLT përfshihet si në Microsoft Internet Explorer ashtu edhe në Netscape Navigator. Nga dy shfletuesit, Internet Explorer ka shumë më tepër mbështetje për XSLT, dhe unë do të përdor versionin 5.5 të atij shfletuesi këtu. Rreth mbështetjes XSLT në Internet Explorer mundeni

Nga libri Linux: Udhëzuesi i plotë autor Kolisnichenko Denis Nikolaevich

Hapi 2. Fillestar i avancuar. përvojë<= 0,5 года. Знания в рамках школьных и институтских курсов информатики + полученные на работе навыки решения конкретных задач. Этот период охватывает промежуток времени от получения предложения о работе до окончания испытательного срока.

Nga libri CSS3 për Web Designers nga Siderholm Dan

6.4.3. Karakteristikat e veçanta të shfletuesve A do t'ju tregojë ky paragraf se si të punoni me shfletues? Pastaj mund ta kaloni fare ose ta lexoni diagonalisht. Jo, i dashur lexues, nuk kisha dyshim se ju dini të punoni me shfletues. Tani ne

Nga libri Revista Dixhitale “Computerra” Nr.225 autor Revista Computerra

Si funksionojnë prefikset e shfletuesit Ja se si funksionon CSS në praktikë me prefikset e shfletuesit. Le të marrim si shembull vetinë e rrezes kufitare. Le të themi se duam të rrumbullakojmë qoshet e një elementi me një rreze prej 10 pikselësh; ja si ta bëni: .foo ( – webkit-border-radius: 10px; – moz-border-radius: 10px; border-radius: 10px;

Nga libri Instalimi, konfigurimi dhe rivendosja e Windows 7 100% autor Vatamanyuk Alexander Ivanovich

Rikthim për të gjithë shfletuesit Shfletuesit që nuk mbështesin ende sfonde të shumëfishta do të injorojnë plotësisht veçorinë e sfondit. Kjo është arsyeja pse ne përcaktuam veçmas veçorinë e ngjyrës së sfondit. 5.05 tregon se si duket faqja në IE7: shumë prejardhje injorohen dhe

Nga libri i autorit

Po shfletuesit e tjerë? Duke hapur formularin në Internet Explorer 7, një shfletues me zero mbështetje CSS3, shohim një formë pune krejtësisht të pranueshme (Figura 6.15). Kjo është e mahnitshme! Të gjitha përmirësimet e shtuara nga vetitë CSS3 u injoruan; skeleti i formës mbetet, duke punuar si

Nga libri i autorit

Po shfletuesit e tjerë? Shtimi i animacioneve CSS shënon herën e parë në këtë libër që ne kemi përmirësuar përvojën e përdoruesit për vetëm një shitës të shfletuesit: WebKit. Një nga arsyet kryesore pse CSS3 po përdoret gjithnjë e më shumë është për shkak të vetive të tij të reja.

Nga libri i autorit

7 shfletues alternativë për iPad Oleg Nechai Publikuar më 15 maj 2014 Me fjalë të rrepta, ekziston vetëm një shfletues i plotë për iOS - Safari. Të gjitha alternativat janë në fakt shtesa grafike dhe grupe skriptesh Java për një motor me burim të hapur.

Nga libri i autorit

12.3. Lejimi dhe bllokimi i programeve specifike Një mënyrë tjetër shumë efektive për të kufizuar aksesin në programe është krijimi i një liste programesh që mund të ekzekutohen. Prandaj, të gjitha programet që nuk përfshihen në këtë listë janë të ndaluar të ekzekutohen

Prefikset e shitësit janë parashtesa të veçanta që shtohen përpara emrit të vetive CSS dhe synojnë funksionet eksperimentale të shfletuesve të caktuar. Çdo shfletues ka prefiksin e vet të shitësit.

Sot do të donim të flasim për prefikset e shitësve, të emërtojmë ato më të zakonshmet dhe të filozofojmë pak për përshtatshmërinë e përdorimit të tyre.

Çfarë është një shitës

Para së gjithash, do të doja të përkufizoja konceptin e fjalës "shitës" në mënyrë që të bëhet e qartë për të gjithë ne se pse prefikset CSS quhen parashtesa të shitësit dhe jo diçka tjetër. Shitësi- një kompani ose markë që prodhon produkte ose ofron shërbime dhe i furnizon ato nën markën e saj. Fjala vjen nga frëngjishtja vendere- shes.

Cilat janë prefikset e shitësit në CSS

Në rastin e prefikseve CSS, shitësit janë prodhues të shfletuesit që përdorin markën e tyre tregtare në një formë të shkurtuar si një parashtesë (prefiks) për disa veçori të CSS për identifikim. " Pse të përdorni këto parashtesa?", pyesni ju. Me fjalë të tjera, disa prona mund të kryejnë një funksion krejtësisht të ri dhe shpesh shumë të dobishëm, i cili më parë duhej të zbatohej duke përdorur hake të veçanta, truket, truket apo edhe javascripts. Megjithatë, kjo pronë nuk është shtuar ende në ato standarde dhe nuk mund të të interpretohet nga të gjithë shfletuesit, për këtë qëllim para kësaj veçorie dhe i shtohet një prefiks me emrin e shitësit të cilit i përket dhe në të ardhmen, kur shfletuesi të interpretojë kodin CSS, prona do të kuptohet saktë dhe do të funksionojë. funksioni për të cilin ishte menduar në të vërtetë.

Lista e prefikseve kryesore të shitësit

Tani le të japim një listë të prefikseve kryesore të shitësve që ekzistojnë aktualisht dhe janë të njohura për ne.

  • -o-- Shfletuesi Opera
  • -moz-- shfletues të familjes Mozilla (prodhuesi i të famshmit Mozilla Firefox)
  • -Znj-- Microsoft Explorer
  • -kit në internet-- shfletuesit që përdorin motorin Webkit - Google Chrome, Safari
  • -kabina-- Shfletuesi alternativ zyrtar i Apple - Ikab
  • -khtml-- një përkthyes KHTML i përdorur rrallë për KDE

Për të përdorur një ose një tjetër prefiks të shitësit, thjesht duhet të zgjidhni atë që ju nevojitet nga lista dhe ta shtoni atë menjëherë përpara pronës eksperimentale që nuk është futur ende në specifikimin e përgjithshëm dhe të shijoni rezultatin.

Këtu, për shembull, është kodi që çaktivizon transformimin (ridimensionin) automatik të tekstit *:

Text-size-adjust: asnjë; -moz-text-size-adjust: asnjë; -ms-text-size-adjust: asnjë; -webkit-text-size-adjust: asnjë;

*Pronë tekst-rregulloj-asnjë Ka kuptim ta përdorni për pajisjet mobile, shfletuesit e të cilëve mund të ndryshojnë automatikisht madhësinë e tekstit në faqe, duke e bërë atë më të lexueshëm, por në të njëjtën kohë duke dëmtuar paraqitjen dhe estetikën.

Së pari ne e përshkruajmë pronën në një mënyrë të përgjithshme - sikur të ishte tashmë në specifikim dhe të mbështetur nga të gjithë shfletuesit, megjithëse nuk është ende kështu, por pas njëfarë kohe ka shumë të ngjarë të bëhet e rëndësishme kur prona të miratohet. Pas kësaj, ne shtojmë të njëjtën pronë me parashtesa të ndryshme për shfletuesit përkatës. Siç mund ta shihni, nuk ka asgjë të komplikuar për këtë, por ky veprim "peshon" shumë kodin, sepse në fakt ne kemi rritur numrin e bajteve të kodit me 4-5 herë, gjë që do të jetë mjaft e dukshme për faqet me shumë stile të ngjashme. Dhe vetë kodi bëhet më pak i lexueshëm, sepse nga përsëritja e përsëritur e së njëjtës gjë ai fillon të valëzojë në sy, dhe thjesht ka një ndjenjë të caktuar të shijes së keqe dhe optimizimit të dobët.

Duke u larguar pak nga tema, dua të them se ekziston një metodë programimi e quajtur OOP (programimi i orientuar nga objekti). Pra, detyra kryesore e tij është të shkurtojë kodin duke përdorur klasa, funksione, etj. Kjo metodë kryesisht ekziston në mënyrë që kryerja e një veprimi specifik në pjesë të ndryshme të programit të mos kërkojë shkrimin e pjesëve identike të kodit. Në rastin e OOP, thjesht mund t'i referoheni një klase të paracaktuar dhe funksioneve të saj. Kjo thjeshton punën dhe redukton dhe optimizon ndjeshëm kodin. Pothuajse e njëjta gjë ndodh në rastin e CSS me prefikset e shitësit - kur ato nuk janë aty, kodi duket i optimizuar për të gjithë shfletuesit dhe kur ata vijnë në ndihmë të koduesve të padurueshëm që duan të vrapojnë përpara lokomotivës së ngadaltë të quajtur W3C, kodi kthehet në një rrëmujë të përbërë nga të njëjtat rreshta të kopjuar 5 herë, që ndryshojnë nga njëri-tjetri nga disa parashtesa të pakuptueshme.

Është më mirë, sigurisht, të shmangni përdorimin e prefikseve të shitësit dhe të mos përpiqeni të kapërceni lokomotivë të një specifikimi të vetëm, por nëse ekziston një dëshirë e parezistueshme dhe nevojë urgjente për të përdorur një ose një tjetër pronë CSS që nuk është pranuar ende nga W3C, atëherë sigurisht që mund të përdorni parashtesa, askush nuk do t'ju godasë në dore për këtë me një vizore nuk do të jetë. Megjithatë, për mendimin tonë, kjo është një formë e keqe.

Në pamje të parë, duket se prefikset e shitësit janë diçka si gramatika...

Rezulton se është më e drejtpërdrejta! Prefikset e shitësit janë parashtesa të emrit të vetive CSS që shtojnë shitësit e shfletuesit për vetitë e pa standardizuara.

Sipas specifikimit CSS 2.1, identifikuesit CSS që fillojnë me "-" ose "_" janë të rezervuar për shtesat e shfletuesit CSS. Pasja e këtyre karaktereve në fillim të veçorisë siguron që shtesat e ardhshme të shfletuesit nuk do të ndërhyjnë kurrë me vetitë standarde të CSS. Ato. asnjë shfletues nuk do të fillojë të kuptojë "rastësisht" një pronë që nuk është menduar për të.

Cilat janë ato?

Prefikset e shitësve të shfletuesve më të zakonshëm tregohen në tabelën e mëposhtme:

Si punon?

Një veti CSS është shkruar për elementin në formë të drejtpërdrejtë për shfletuesit që e kuptojnë atë. Pas saj, e ndarë me një pikëpresje, është e njëjta veti, por me parashtesa të ndryshme të shitësit për shfletues të ndryshëm. Shfletuesi nga një kod i tillë interpreton vetëm ato veti që janë shkruar për të dhe injoron ato të shkruara për shfletues të tjerë.

Për shembull, vetia CSS përgjegjëse për transparencën e elementit përdoret ndër-shfletues si kjo:

Filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); /* IE 5.5-7*/ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";/* IE 8*/ -moz-opacity:0.5;/* Mozilla 1.6 */ -khtml- opacity:0.5;/* Konqueror 3.1, Safari 1.1 */ opacity:0.5/* Safari 2.0+, Chrome, Firefox Opera, */

Për çfarë është?

Në blogun e tyre, zhvilluesit e Internet Explorer citojnë tre arsye për përdorimin e prefiksit të shitësit -ms- për IE8:

  1. Nëse kjo veti është projektuar vetëm për Microsoft IE dhe nuk përshkruhet në specifikimin ose modulin CSS
  2. Nëse moduli CSS të cilit i përket kjo pronë është në zhvillim e sipër W3C dhe ende nuk ka arritur statusin e rekomandimit të kandidatit
  3. Nëse një veti zbaton vetëm pjesërisht funksionalitetin e një vetie të përshkruar në një modul ose specifikim CSS

Zhvillues të tjerë përdorin prefikset e shitësit për arsye të ngjashme. Për shembull, Mozilla ka një listë të madhe të vetive individuale CSS dhe vlerat e tyre me prefikset e shitësit -moz-, të cilat janë zhvilluar posaçërisht për Firefox-in dhe nuk përshkruhen as në modulin CSS dhe as në specifikim.

Për më tepër, zhvilluesit e Microsoft arritën të fshehin konstruksione të pavlefshme nga verifikuesi duke përdorur prefikset e shitësit. Kjo vlen kryesisht për filtrat. Për IE 5.5-7 filtri dukej kështu:

Filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); /*IE 5.5-7*/

Në parim, një dizajn i tillë nuk mund të kalojë vërtetimin! Por kalohet lehtësisht nga një dizajn i ri i të njëjtit filtër, por për IE 8:

Ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";/* IE 8*/

Sigurisht, nuk dëshironi të shkruani disa rreshta kodi me vetitë e shitësit për çdo shfletues në vend të një rreshti kodi me vetitë standarde. Por nuk duhet të harrojmë se specifikimi CSS3 është ende në zhvillim e sipër. Ka mundësi që gjatë standardizimit të ndryshojë diçka në përshkrimin e pronës ose të mos jetë fare në specifikim. Atëherë sigurisht që do të jetë më e lehtë për zhvilluesit të braktisin pronën e shitësit dhe të ruajnë standardet. Pajtohem, nëse e njëjta pronë funksionon ndryshe në versione të ndryshme të shfletuesit, asgjë e mirë nuk do të vijë prej saj. Do të ishte më mirë nëse vetitë e shitësit do të funksiononin në versionet më të vjetra të shfletuesve dhe që versionet e reja do të mbështesnin drejtpërdrejt specifikimet dhe pronat me prefikset e shitësit do të injoroheshin.

Bonus i bukur

Falë prefikseve të shitësve, shitësit e shfletuesit tashmë po zbatojnë veçori eksperimentale CSS3 me rrezikun e tyre.

Koduesi tashmë mund të zbatojë shumicën e veçorive të ofruara nga CSS3, duke përfshirë tranzicione dhe animacione të ndryshme pa përdorur skriptet, por duke përdorur prefikset e shitësit.

Një shembull i mirë i një zbatimi të tillë do të ishte përdorimi i vetive CSS3. Le të vendosim detyrën e zbatimit të një ndryshimi të qetë të ngjyrës së sfondit për një lidhje kur rri pezull kursorin, pa përdorur JavaScript. Për ta bërë këtë, duhet të shtoni kodin e mëposhtëm në CSS për lidhjen:

Webkit-transition:background-color 5s ease-in 3s;/* punon në Safari 3.1+, Chrome 1+ */ -o-transition:background-color 5s ease-in 3s;/* punon në Opera 10.5+ */ - moz-transition:background-color 5s ease-in 3s;/* planifikuar për Firefox 4.0+ */ transition:background-color 5s ease-in 3s;/* nuk mbështetet drejtpërdrejt nga asnjë shfletues */

Ju mund të shihni një shembull të drejtpërdrejtë.

Artikujt më të mirë mbi këtë temë