Share
U hebt ongetwijfeld gelezen over de prefix van de leverancier webontwikkelingsdrama van de week. Als dat niet het geval is, zijn de W3C-maillijsten in brand gestoken sinds het werd besproken (en in wezen werd aangekondigd) dat Microsoft, Opera en Firefox zullen beginnen met adopteren en stijl webkit-vooraf ingestelde eigenschappen. Een van de redenen achter deze beslissing is dat wij ontwikkelaars niet verantwoordelijk zijn voor het coderen van onze stylesheets; we zijn te veel webkit-specifieke eigenschappen aan het toepassen, zonder rekening te houden met andere browsers.
Toen ik dit hoorde, bleef ik bij mezelf denken: is dit echt waar??
Als je het hete drama wilt inhalen, krijg je de volgende artikelen als gelezen:
De basisgeest is dat niet-webkit-leveranciers van plan zijn het te herkennen en te stijlen
-webkitvoorvoegsel op een aantal CSS3-eigenschappen. Dit is gedeeltelijk te wijten aan het feit, zeggen ze, dat te veel ontwikkelaars lui zijn geweest, te veel leunen op Webkit en oudere projecten niet updaten (vooral niet voor mobiele ontwerpen). Aangezien deze concurrerende browsers het zien, hebben ze geen keus; hun handen worden gedwongen.
Het is een ding om te spelen met niet-standaard, Webkit-specifieke eigenschappen voor de lol (zoals -webkit-text-stroke); we hebben zelfs soortgelijke artikelen gepost op Nettuts +. Het is echter helemaal iets anders als ontwikkelaars bijvoorbeeld uitsluitend het voorvoegsel van Webkit gebruiken bij het toepassen van CSS-gradiënten of overgangen.
Een vaak aangeprezen excuus als u niet alle CSS3-eigenschappen correct invoegt, is het aanzienlijk moeilijk om bij te houden welke voorvoegsels nodig zijn voor een bepaalde eigenschap. Dit is zeker waar, maar heeft onze community niet een verscheidenheid aan oplossingen geboden?
Om te beginnen met de handleiding, opzoekroute, is CanIUse.com een fantastische referentie wanneer we moeten bepalen of een bepaalde browser een CSS3-eigenschap ondersteunt. Als dit wordt ondersteund, maar een voorvoegsel vereist, laat CanIUse u dit weten.
Het is een essentiële bladwijzer voor alle webontwikkelaars (en is niet beperkt tot alleen CSS).
Compass is een raamwerk voor Sass dat, onder andere, automatisch het proces van het voorvoegen van uw CSS3-eigenschappen zal afhandelen. Bijvoorbeeld om cross-browser te gebruiken, zuinigheidsbesparend box-sizing naar een website, met CSS, zouden we schrijven:
* -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
Bij het gebruik van Compass kunnen we eenvoudigweg een mixin opnemen, zoals:
* @include box-sizing (border-box);
Op deze manier hoeven ontwerpers zich nooit zorgen te maken of een bepaalde browser al dan niet een vooraf gedefinieerde versie van een nieuwe eigenschap biedt; Compass doet het voor u.
Bij Nettuts + hebben we ook een eenvoudige manier geboden om 'automatisch voorvoegsel' te gebruiken. Gebruik de website of de API in uw favoriete codebewerker om automatisch door uw stylesheet te filteren en werk CSS3-eigenschappen bij die een vooraf gedefinieerde versie missen. Dit kan zelfs worden geïntegreerd in uw build-script, zodat u alleen code gebruikt met de officiële syntaxis.
Het verschil tussen Prefixr en Compass is dat de eerste geen preprocessor nodig heeft, als u alle CSS met de hand wilt coderen. Voer gewoon Prefixr een stylesheet in, en het doet de rest.
Lea Verou's Prefix-Free is ook een mooie oplossing. Het is uniek omdat het een JavaScript-gebaseerde oplossing is die dynamisch bepaalt welke browser wordt gebruikt en vervolgens de nodige voorvoegsels toewijst aan de stylesheet. Importeer eenvoudig Prefix-vrij, gebruik de officiële syntaxis voor de nieuwe CSS3-eigenschappen en het zorgt voor de rest.
Hoewel sommigen misschien het feit zien dat JavaScript afhankelijk is om als een nadeel te fungeren, is een aanzienlijke bonus voor deze methode dat uw stylesheets zowel kleiner als beter houdbaar worden. Voor ontwikkelingsdoeleinden is het een goede keuze; Voor productie kunt u echter overwegen een ander hulpmiddel te gebruiken, omdat dit aanzienlijke gevolgen kan hebben voor de prestaties.
CSS3Please is een handige service die copy-and-paste, cross-browser CSS biedt. Pas de waarden aan op basis van uw behoeften en u hebt meteen een fragment dat alle relevante browsers correct target.
Als u een preprocessor-gebruiker bent die liever zijn of haar eigen CSS3-mixins maakt, dan is dat fantastisch; zijn er echter anderen die deze services niet gebruiken? Zo ja, waarom niet? Het is begrijpelijk dat Firefox en Microsoft zich gedwongen voelen om het webkit-voorvoegsel voor sommige eigenschappen te ondersteunen, ondanks hun beter inzicht. Met name voor oudere en kleinere projecten zijn we niet altijd even goed in het bijwerken van de stylesheets als dat nodig is. Dit is precies waarom prefix-eigenschappen zo lang zijn blijven hangen, ondanks het feit dat eigenschappen zoals border-radius zijn al lang ondersteund, niet-voorbereid. Webkit wil deze websites niet "breken".
Dus wat is de deal? Zijn we niet verantwoordelijk??
Christian Heilmann heeft een project gelanceerd, genaamd Prefix the Web; het moedigt ontwikkelaars aan om GitHub-projecten bij te werken om alle benodigde browser-voorvoegsels op te nemen. Helaas kan het initiatief te laat zijn. Wat denk je?
Accentsconagua