suchen
HeimWeb-FrontendCSS-TutorialEs ist an der Zeit, die Präfixe der Verkäufer in CSS zu überdenken

It's Time to Rethink Vendor Prefixes in CSS

Schlüsselpunkte

    Die weit verbreitete Verwendung des
  • -Präfixes in -webkit- in CSS führt dazu, dass einige Websites nicht ordnungsgemäß ohne ihn funktionieren und Mozilla dazu zwingen, nicht standardmäßige -webkit -Refixe zur Verbesserung der Firefox-Kompatibilität mit Webseiten mithilfe von -webkit- Präfix, zu unterstützen, die
  • -Refix, die FIRFOX-Kompatibilität, unterstützt. Dies steht im Einklang mit dem Ansatz von Microsoft Edge und Opera.
  • -moz- Entwicklern wird empfohlen, die Verwendung von Präfixen zu überdenken und ihre Website -Kompatibilität zu testen, insbesondere diejenigen, die das Präfix
  • weglassen, da neue Änderungen ihre Websites auf Firefox 46 oder 47 beeinflussen können.
  • Wie Chrome/Blink-, Firefox- und Microsoft Edge -Teams nach besseren Lösungen suchen, verschwindet der Anbieter -Präfix allmählich. Das Aufgeben von Anbieterpräfixen bedeutet, dass die Verwendung von sie für elegante Herabstufungen verwendet wird, ist kein praktikabler Ansatz, und Entwickler sollten sicherstellen, dass die Verwendung von Präfixen keine unerwarteten Ergebnisse in nicht-Webkit-Browsern liefert.

-webkit- Da das Präfix -webkit- CSS im Netzwerk dominiert, funktionieren einige Websites ohne es nicht ordnungsgemäß. Dies ist zwar eindeutig ein Zeichen dafür, dass der Ansatz des Entwicklers in den letzten Jahren nicht ideal ist, aber er hat zu einer ziemlich unglücklichen, aber fast notwendigen Messung von Mozilla geführt. Bis Firefox 46 oder 47 (im April oder Mai 2016 veröffentlicht) plant Mozilla, die Unterstützung für eine Reihe von nicht standardmäßigen -webkit Präfixen zur Verbesserung von Firefox und zur Verwendung von

-Refixen (normalerweise mobile) Webseitenkompatibilität implementieren.

-webkit- Dies ist keine neue Idee, und Microsoft Edge unterstützt auch einen Bereich von -webkit- Präfixen für die Kompatibilität. Opera begann bereits 2012 mit der Implementierung des Präfixes

und ist seitdem in die Webkit-basierte Blink Engine gewechselt.

W3C und Browserhersteller beabsichtigen nicht, das Präfix des Herstellers auf Produktionswebsites zu verwenden:

"W3Cs offizielle Richtlinienerklärung, Sie sollten keine experimentellen Attribute im Produktionscode verwenden, aber die Leute, weil sie die Website cool aussehen und an der Spitze der Technologie bleiben möchten."

-moz- Entwickler möchten sie jedoch so schnell wie möglich verwenden, um auf die neuesten Funktionen zuzugreifen. Während Präfixe aufgrund der Dominanz von Webkit zu Verwirrung geführt haben, haben sie dem Netzwerk erfolgreich geholfen, schnell zu wachsen. Der Ansatz von Mozilla und Microsoft kann für die meisten Websites harmlos sein. Die meisten Online -Websites enthalten möglicherweise bereits das Präfix

, oder Sie werden feststellen, dass die Updates von Mozilla keine Maßnahmen zur Verbesserung der Kompatibilität ihrer Website benötigen. Als professionelle Webentwickler müssen wir jedoch gründlich sein und verstehen, dass einige Designs möglicherweise abnormale Ergebnisse haben. Möglicherweise wissen Sie bereits, welche Ihrer Arbeiten durch Aktualisierungen unterbrochen werden können.

Entwickler, es ist offensichtlich Zeit zu überdenken, wie Sie Präfixe verwenden und diese Websites testen.

beteiligte Präfixe

Mozilla muss möglicherweise eine Reihe von Präfixen -webkit- enthalten. Soweit ich weiß, wird Mozilla nicht mit der von Edge unterstützten Präfixliste -webkit- übereinstimmen, da nicht alle dies möglicherweise sicherstellen muss, dass die Gecko -Layout -Engine von Mozilla mit dem breiteren Netzwerk kompatibel ist.

gemäß ihrer Erklärung zur Wiki -Seite zur Kompatibilität/mobile/nicht standardmäßige Kompatibilität, umfassen die Präfixe, die Mozilla annehmen kann,:

  • -webkit-flexbox
  • -webkit- Gradient des Präfixs
  • -webkit-transforms
  • -webkit-transitions
  • -webkit-appearance
  • -webkit-background-clip
  • -webkit-device-pixel-ratio
  • -webkit-animation
  • -webkit-border*

Einige andere Merkmale können auch betroffen sein, wie @-webkit-keyframes.

Cross-Browser-Test ist entscheidend

Wenn Sie ein Webentwickler sind, der das Präfix -moz- weglässt, um zu vermeiden, dass neuere CSS -Funktionen auf Firefox testen müssen. Sie gehen davon aus Die Stelle in Firefox 46 oder 47. Diese Versionen von Firefox werden im April oder Mai veröffentlicht, sodass Sie etwas Zeit haben, vorauszuplanen.

Um Ihre Website zu testen, bevor diese Änderungen auf Firefox 46/47 ankommen, können Sie den aktuellen Status der Änderungen in Firefox nächtäter über die about:config -Rendien in layout.css.prefixes.webkit zugreifen. Wenn Sie die neueste nächtliche Version installiert haben, sollte sie standardmäßig auf true eingestellt werden. Nicht alle -webkit- -Präfixänderungen sind in Firefox nächtäter aufgetreten, aber hier können Sie das aktuelle Erscheinungsbild Ihrer Website testen. Ich empfehle, bis um den März zu warten, um Firefox Nacht für einen gründlicheren Test zu verwenden.

dringend hat Microsoft Edge das -webkit- Präfix auf diese Weise interpretiert und angezeigt. Dies bedeutet, dass alle in Ihrer Website enthaltenen Webkit -spezifischen Stile bereits in einem Browser angezeigt wurden, den Sie nicht erwartet haben. Wenn Sie dies nicht getan haben, besuchen Sie Microsoft Edge in Windows 10 und testen Sie diese Websites!

Herstellerpräfix verschwindet

Zum Glück scheint das Präfix des Anbieters zu verschwinden, da das Browser -Team nach einer besseren Lösung sucht. Das Chrome/Blink -Team hat ihren Ansatz optimiert:

"Ich freue mich nach vorne, wir werden das Präfix des Anbieters nicht mehr verwenden, um die Standardfunktion zu aktivieren, sondern die (nichtfixierte) Funktion hinter der Aktivität der experimentellen Webplattform -Funktionen in about:flags hinterlassen, bis die Feature bis zur Aktivierung standardmäßig bereit ist. ”” —Rome/Blink Team

Das Firefox -Team bewegt sich auf einen ähnlichen Ansatz:

"Zu den eigenen Bedingungen besteht der aktuelle Trend in Mozilla darin, die Präfixe von Anbietern zu vermeiden, indem sie die Funktionen vor der Veröffentlichung oder Veröffentlichung von Funktionen ohne Präfixe ausschalten, wenn sie stabil genug sind. Zumindest als allgemeine Strategie; Ausnahmen können für bestimmte Fälle erforderlich sein . ” - Boris von Mozilla

Microsoft Edge zielt darauf ab, die Unterstützung für Präfixe vollständig zu entfernen:

"Microsoft wird auch die Präfixe von Edge -Anbietern los. Dies bedeutet, dass Entwickler, damit sie spezielle HTML5- oder CSS -Funktionen nutzen können, keine spezifischen Kantenpräfixe verwenden müssen. Stattdessen müssen sie nur so codieren, so entsprechend nach Angaben zu kodieren, so dass sie nachlehnten, so dass sie nachleitet, so dass sie nachleitet, nach wie zu den Webstandards

Keine eleganten Herabstufungen mehr durch Präfixe

Diese Entfernung vom Präfix des Herstellers bedeutet einen Aspekt - elegante Herabstufungen durch das Präfix des Herstellers sind offensichtlich nicht machbar.

Verwenden von Anbieter -Präfixen zum Auffinden spezifischer Browser (z. B. spezifischer Inhalt nur für Chrom) ist nicht die Absicht der Anbieter -Präfixe. Wenn Sie eine Funktion verwenden, die auf vorangestellten Attributen beruht und das Design auf anderen Browsern mit Präfixen elegant senkt, funktioniert dies nicht mehr.

-webkit- -o- Schlussfolgerung

Zeiten ändern sich. Die Dominanz von Webkit hat versehentlich zu Netzwerkspaltungen und Inkompatibilität geführt, und andere Browser versuchen, ihre Kompatibilität zu verbessern, um durch die Implementierung des Präfixs Schritt zu halten. Während dieses Problem mit dem Ausgang der Anbieterpräfixe verschwinden sollte, müssen die Entwickler überprüfen, ob die Verwendung von Präfixen bei Nicht-Wirbelbrowsern keine unerwarteten Ergebnisse liefert.

-webkit- Nützliche Links

Mozilla -Absichtsdokumentation zu diesen Änderungen

    Mozillas Fehlerverfolgung für dieses Problem in Bugzilla
  • Die neueste Version von Microsoft Edge unterstützt Webkit API
  • Dokumentation zur Einführung des Präfixs
  • in den Standard des Online -Lebens
  • Der Bericht des Registers über Firefox Webkit -Kompatibilitätsänderungen -webkit-
  • Häufig gestellte Fragen zu den Präfixen des Herstellers in CSS

Was sind Anbieter -Präfixe in CSS und warum verwenden Sie sie?

Das Präfix des Anbieters ist eine Möglichkeit für Browserhersteller, neue CSS -Funktionen hinzuzufügen, bevor sie Teil der offiziellen CSS -Spezifikation werden. Sie werden verwendet, um sicherzustellen, dass diese neuen Funktionen die vorhandenen Funktionen in anderen Browsern nicht beeinträchtigen. Auf diese Weise können Entwickler mit neuen Funktionen experimentieren und Feedback zum CSS -Spezifikationsprozess geben.

Ist das Präfix des Anbieters in der modernen Webentwicklung noch notwendig?

Die Notwendigkeit von Anbieterpräfixen war schon immer ein Thema der Debatte unter Webentwicklern. Während sie einst entscheidend für die Gewährleistung der Cross-Browser-Kompatibilität waren, verzeichnete das moderne Web eine signifikante Standardisierung der CSS-Funktionen zwischen verschiedenen Browsern. Daher wird die Nachfrage nach Anbieterpräfixen stark reduziert, in einigen Fällen jedoch immer noch für experimentelle Funktionen verwendet.

Was sind einige gemeinsame Anbieter -Präfixe?

Einige gemeinsame Anbieter-Präfixe umfassen -webkit- (Chrome, Safari, neuere Opera-Version), -moz- (Firefox), -o- (alt, vor-Webkit-Opera-Version) und -ms- (Internet Explorer und Microsoft Rand).

Wie verwendet ich das Präfix des Anbieters in meinem CSS -Code?

Um ein Anbieter -Präfix zu verwenden, fügen Sie ihn einfach vor der CSS -Eigenschaft im Stylesheet hinzu. Zum Beispiel können Sie border-radius das -moz-border-radius: 10px; -Matchtribut mit Firefox -Anbieter -Präfix verwenden.

Was sind die Nachteile der Verwendung von Herstellernpräfixen?

Der Hauptnachteil der Verwendung von Anbieter -Präfixen besteht darin, dass sie Ihren CSS -Code komplexer und schwieriger zu pflegen. Jeder Browser verfügt über ein eigenes Präfix des Anbieters. Möglicherweise müssen Sie möglicherweise mehrere Codezeilen für eine einzelne CSS -Eigenschaft schreiben. Darüber hinaus können Anbieterpräfixe zu Problemen mit Codeüberprüfung führen, da sie nicht Teil der offiziellen CSS -Spezifikation sind.

Wie vermeiden Sie das Präfixproblem des Herstellers?

Eine Möglichkeit, Prefix -Probleme zu vermeiden, besteht darin, einen CSS -Präprozessor wie Sass oder weniger zu verwenden, der Ihrem Code automatisch Anbieter -Präfixe hinzufügt. Eine weitere Option ist die Verwendung eines Postprozessors wie Autoprefixer, mit dem die Präfixe von Anbietern basierend auf dem Browser hinzugefügt werden können, den Sie unterstützen möchten.

Gibt es eine Alternative zur Verwendung von Herstellernpräfixen?

Ja, es gibt Alternativen zur Verwendung von Anbieter -Präfixen. Eine Alternative besteht darin, eine Feature -Erkennungsbibliothek wie Modernizr zu verwenden, mit der Sie bestimmte CSS -Funktionen testen und eine Fallback -Lösung für Browser bereitstellen können, die sie nicht unterstützen. Eine andere Alternative besteht darin, CSS -Gitter oder Flexbox zu verwenden, die jetzt weit verbreitet sind und keine Anbieter -Präfixe benötigen.

Wie ist die Zukunft des Präfix des Herstellers in CSS?

Die Zukunft des Präfix des Herstellers in CSS ist ungewiss. Während sie in einigen Fällen noch verwendet werden, besteht der Trend darin, sich eher zur Standardisierung und Verwendung der Funktionserkennung als an die Präfixe von Anbietern zu bewegen. Sie bleiben jedoch auf absehbare Zeit wahrscheinlich Teil des CSS -Umfelds.

Wie wirkt sich das Präfix des Anbieters auf die Website der Website aus?

Präfixe von Lieferanten können sich auf die Website der Website auswirken, da sie die Größe des CSS -Code erhöhen. Die Auswirkung ist jedoch normalerweise gering, insbesondere wenn Sie einen CSS -Kompressor verwenden, um Ihren Code zu komprimieren.

Wie kann man mit den neuesten Entwicklungen bei den Präfixen des Herstellers Schritt halten?

Aufgrund der sich schnell verändernden Natur der Webentwicklung kann es schwierig sein, die neuesten Entwicklungen in den Präfixen der Anbieter auf dem Laufenden zu halten. Es kann jedoch hilfreich sein, CSS-bezogenen Blogs, Foren und Social-Media-Konten zu verfolgen. Darüber hinaus sind die Website der CSS Working Group und das Mozilla Developer Network hervorragende Ressourcen, um über die neuesten Informationen auf dem Laufenden zu bleiben.

Das obige ist der detaillierte Inhalt vonEs ist an der Zeit, die Präfixe der Verkäufer in CSS zu überdenken. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Entmystifizierende Bildschirmleser: Zugrunde Formen und Best PracticesEntmystifizierende Bildschirmleser: Zugrunde Formen und Best PracticesMar 08, 2025 am 09:45 AM

Dies ist der 3. Beitrag in einer kleinen Serie, die wir in Form von Barrierefreiheit gemacht haben. Wenn Sie den zweiten Beitrag verpasst haben, lesen Sie "Verwalten des Benutzerfokus mit: Fokus-Sichtbar". In

Hinzufügen von Kastenschatten zu WordPress -Blöcken und -ElementenHinzufügen von Kastenschatten zu WordPress -Blöcken und -ElementenMar 09, 2025 pm 12:53 PM

Die CSS-Box-Shadow- und Umrisseigenschaften haben Thema gewonnen. JSON-Unterstützung in WordPress 6.1. Sei ein paar Beispiele für die Funktionsweise in realen Themen und welche Optionen wir diese Stile auf WordPress -Blöcke und Elemente anwenden müssen.

Arbeiten mit GraphQL CachingArbeiten mit GraphQL CachingMar 19, 2025 am 09:36 AM

Wenn Sie kürzlich mit GraphQL gearbeitet oder seine Vor- und Nachteile überprüft haben, haben Sie zweifellos Dinge wie "GraphQL nicht unterstützen Caching" oder gehört

Machen Sie Ihren ersten Seltsamen -Sufle -ÜbergangMachen Sie Ihren ersten Seltsamen -Sufle -ÜbergangMar 15, 2025 am 11:08 AM

Die Sufelte Transition -API bietet eine Möglichkeit, Komponenten zu beleben, wenn sie das Dokument eingeben oder verlassen, einschließlich benutzerdefinierter Svelte -Übergänge.

Edle und coole CSS -Scrollbars: Ein SchaufensterEdle und coole CSS -Scrollbars: Ein SchaufensterMar 10, 2025 am 11:37 AM

In diesem Artikel werden wir in die Welt der Scrollbars eintauchen. Ich weiß, es klingt nicht zu glamourös, aber vertrau mir, eine gut gestaltete Seite geht Hand in Hand

Show, Don ' TellShow, Don ' TellMar 16, 2025 am 11:49 AM

Wie viel Zeit damit, die Inhaltspräsentation für Ihre Websites zu entwerfen? Wenn Sie einen neuen Blog -Beitrag schreiben oder eine neue Seite erstellen, denken Sie darüber nach

Aufbau einer Ethereum -App mit Redwood.js und FaunaAufbau einer Ethereum -App mit Redwood.js und FaunaMar 28, 2025 am 09:18 AM

Mit dem jüngsten Aufstieg von Bitcoins Preis über 20.000 USD und kürzlich von 30.000, dachte ich, es lohnt

Was zum Teufel haben NPM -Befehle?Was zum Teufel haben NPM -Befehle?Mar 15, 2025 am 11:36 AM

NPM-Befehle führen verschiedene Aufgaben für Sie aus, entweder als einmalige oder als kontinuierlich ausgeführter Vorgang für Dinge wie das Starten eines Servers oder das Kompilieren von Code.

See all articles

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heiße Werkzeuge

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

SAP NetWeaver Server-Adapter für Eclipse

SAP NetWeaver Server-Adapter für Eclipse

Integrieren Sie Eclipse mit dem SAP NetWeaver-Anwendungsserver.

MinGW – Minimalistisches GNU für Windows

MinGW – Minimalistisches GNU für Windows

Dieses Projekt wird derzeit auf osdn.net/projects/mingw migriert. Sie können uns dort weiterhin folgen. MinGW: Eine native Windows-Portierung der GNU Compiler Collection (GCC), frei verteilbare Importbibliotheken und Header-Dateien zum Erstellen nativer Windows-Anwendungen, einschließlich Erweiterungen der MSVC-Laufzeit zur Unterstützung der C99-Funktionalität. Die gesamte MinGW-Software kann auf 64-Bit-Windows-Plattformen ausgeführt werden.

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

WebStorm-Mac-Version

WebStorm-Mac-Version

Nützliche JavaScript-Entwicklungstools