Vous avez sans doute lu sur le préfixe du vendeur drame de développement web de la semaine. Sinon, les listes de diffusion du W3C sont en feu depuis qu'il a été discuté (et annoncé essentiellement) que Microsoft, Opera et Firefox commenceront à adopter et le style des propriétés préfixées webkit. L'une des raisons de cette décision est que nous, les développeurs, ne sommes pas responsables du codage de nos feuilles de style. nous appliquons trop de propriétés spécifiques au webkit, sans prendre en compte les autres navigateurs.
En entendant cela, je me suis demandé: est-ce vraiment vrai??
Pour rattraper le drame chaud, donne la lecture des articles suivants:
L’essentiel est que les fournisseurs autres que Webkit envisagent de reconnaître et de styliser les
-webkit
préfixe sur un certain nombre de propriétés CSS3. Ceci est en partie dû au fait que trop de développeurs ont été paresseux, s’appuyant trop sur Webkit et n’ayant pas mis à jour des projets plus anciens (en particulier pour les conceptions mobiles). Selon ces navigateurs concurrents, ils n’ont pas le choix; leurs mains sont forcées.
C’est une chose de jouer avec des propriétés non standard, spécifiques à Webkit, pour le plaisir (telles que -webkit-text-stroke
) nous avons même publié des articles similaires sur Nettuts +. Cependant, c’est tout autre chose si les développeurs utilisent, par exemple, exclusivement le préfixe Webkit lorsqu’ils appliquent des dégradés ou des transitions CSS.
Un souvent vanté excuse Pour ne pas préfixer correctement toutes les propriétés CSS3, il est parfois très difficile de savoir quels préfixes sont nécessaires pour une propriété donnée. C’est certes vrai, mais notre communauté n’a-t-elle pas fourni diverses solutions?
CanIUse.com est une référence fantastique lorsque nous devons déterminer si un navigateur particulier prend en charge une propriété CSS3. S'il est pris en charge mais requiert un préfixe, CanIUse vous indiquera.
C'est un signet essentiel pour tous les développeurs Web (et ne se limite pas aux CSS).
Compass est un framework pour Sass qui, entre autres choses, gérera automatiquement le processus de préfixe de vos propriétés CSS3. Par exemple, pour appliquer plusieurs navigateurs, économiser de la santé mentale taille de la boîte
sur un site web, avec CSS, nous écririons:
* -webkit-box-sizing: border-box; -moz-box-dimensionnement: border-box; -ms-box-sizing: border-box; taille de la boîte: boîte-frontière;
Cependant, lorsque vous utilisez Compass, nous pouvons simplement inclure un mixin, comme ceci:
* @include box-sizing (border-box);
De cette manière, les concepteurs n'ont jamais à se préoccuper de savoir si un navigateur donné fournit une version préfixée d'une nouvelle propriété. Compass le fait pour vous.
Chez Nettuts +, nous avons également fourni un moyen simple de «préfixer automatiquement». Utilisez le site Web ou son API dans votre éditeur de code préféré pour filtrer automatiquement votre feuille de style et mettre à jour les propriétés CSS3 pour lesquelles une version préfixée est manquante. Cela peut même être intégré dans votre script de construction, de sorte que vous ne codiez jamais en utilisant la syntaxe officielle..
La différence entre Prefixr et Compass est que le premier ne nécessite pas de pré-processeur, si vous préférez coder tous les CSS à la main. Il suffit de nourrir Prefixr une feuille de style, et il fera le reste.
Préfixe-Libre de Lea Verou est également une solution élégante. Il s'agit d'une solution basée sur JavaScript qui détermine de manière dynamique le navigateur utilisé, puis attribue les préfixes nécessaires à la feuille de style. Importez simplement sans préfixe, utilisez la syntaxe officielle pour les nouvelles propriétés CSS3, et le reste sera pris en charge.
Bien que certains considèrent le fait que le fonctionnement de JavaScript dépende de JavaScript, un avantage considérable de cette méthode réside dans le fait que vos feuilles de style deviennent à la fois plus petites et plus faciles à gérer. À des fins de développement, c'est un excellent choix. toutefois, pour la production, vous pouvez envisager d’utiliser un outil différent, car les conséquences sur les performances peuvent être considérables..
CSS3Please est un service astucieux qui fournit du CSS inter-navigateur copié-collé. Ajustez les valeurs en fonction de vos besoins et vous obtenez instantanément un extrait qui ciblera correctement tous les navigateurs concernés..
Si vous êtes un utilisateur de préprocesseur qui préfère créer ses propres mixins CSS3, alors fantastique; Cependant, sinon, certains d'entre vous n'utilisent-ils pas ces services? Si oui, pourquoi pas? Il est compréhensible que Firefox et Microsoft se sentent obligés de prendre en charge le préfixe webkit pour certaines propriétés, malgré leur jugement. Particulièrement pour les projets plus anciens et plus petits, nous ne sommes pas toujours doués pour mettre à jour les feuilles de style au besoin. C’est précisément pourquoi les propriétés préfixées traînent depuis si longtemps, malgré le fait que des propriétés telles que rayon de la frontière
depuis longtemps pris en charge, sans préfixe. Webkit ne veut pas "casser" ces sites.
Alors, quel est le problème? Sommes-nous pas responsable?
Christian Heilmann a lancé un projet appelé Prefix the Web; Il encourage les développeurs à mettre à jour les projets GitHub pour y inclure tous les préfixes de navigateur nécessaires. Malheureusement, l'initiative est peut-être trop tard. Qu'est-ce que tu penses?