Heim > Web-Frontend > CSS-Tutorial > Es ist an der Zeit, die Präfixe der Verkäufer in CSS zu überdenken

Es ist an der Zeit, die Präfixe der Verkäufer in CSS zu überdenken

Joseph Gordon-Levitt
Freigeben: 2025-02-23 08:58:11
Original
113 Leute haben es durchsucht

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!

Erklärung dieser Website
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
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage