Wie aktiviere ich CSS3-Funktionen in Internet Explorer 6, 7 und 8?


18

Während IE9 sehr vielversprechend aussieht, werden uns IE6, IE7 und IE8 wahrscheinlich noch viele Jahre verfolgen und die Verbreitung von CSS3 im Web verlangsamen.

Eine Reihe von Projekten, die auf HTC und JS basieren, erweitern den IE um CSS3-Unterstützung:

  • CSS3PIE
  • IE7.js
  • eCSStender
  • DD_roundies
  • border-radius.htc (gekrümmte Ecke)
  • ie-css3.htc
  • ie-css3.js

Ich habe nur Erfahrung mit CSS3PIE (mache die abgerundeten Sachen auf http://docs.composite.net/ ) und abgesehen von den Mouse-Over-Effekten funktioniert dies gut und ist reines CSS3.

Welche CSS3-Funktionen bringen die verschiedenen Projekte in den IE und wie gut? Ist einer von ihnen ein klarer Gewinner?


1
Probieren Sie sie alle aus und lassen Sie uns wissen, was Sie finden. Wenn Sie ein Blog haben, wäre es ein großartiger Beitrag, der viel Interesse wecken würde, da bin ich mir sicher.
John Conde

Ich fand dies auf der CSS3PIE-Website css3pie.com/documentation/product-comparison, aber ich würde erwarten, dass es voreingenommen ist, daher die Frage. Es erfordert ein bisschen Erfahrung in der realen Welt, um ein gutes Gefühl zu bekommen.
Mawtex

Antworten:


8

Da noch niemand aufgetaucht ist, werde ich versuchen, darauf eine Antwort zu geben. Es wird meistens von http://css3pie.com/documentation/product-comparison/ gelesen und durchgegoogelt. Ich habe nur praktische Erfahrungen mit CSS3PIE. Wenn Sie eines der anderen Projekte kennen, können Sie dieses gerne bearbeiten

CSS3PIE von Jason Johnston Fügt eine gute Unterstützung für Css3-Rahmenradius, Farbverläufe und Kastenschatten hinzu. Meine Erfahrung damit ist, dass es ziemlich gut funktioniert und große Unterstützung für den Grenzradius bietet. Problematisch für Hover-Effekte (ich würde erwarten, dass alle Elemente auf dieser Liste darunter leiden), aber bei Verwendung in statischem HTML makellos. Weitere Informationen unter http://css3pie.com/

ie-css3.js von Keith Clark Fügt Unterstützung für viele CSS3 -Pseudoklassen -Selektoren hinzu. Ist extrem klein, da es sich auf andere von Ihnen eingebundene js-Bibliotheken wie jQuery stützt. Dies könnte gut mit anderen Projekten auf dieser Liste wie CSS3PIE funktionieren. Weitere Informationen unter http://www.keithclark.co.uk/labs/ie-css3/
UPDATE Das ie-css.js-Projekt wurde hier wiedergeboren: http://selectivizr.com/

IE9.js von Dean Edwards Works für IE6, 7 und 8. Machen Sie IE-Unterstützung für transparentes PNG, neue CSS-Selektoren wie parent> child und: first-of-type, feste Positionierung, Unterstützung für maximale / minimale Breite / Höhe. Es ist mein Eindruck, dass im Laufe der Jahre viel Arbeit in diese Sache geflossen ist. Einige Bewertungen sind wirklich positiv, andere abweisend. Weitere Informationen unter http://code.google.com/p/ie7-js/

ecsstender von Aaron Gustafson Arbeitet mit IE6, 7 und 8. Fügt auf modulare Weise Unterstützung für CSS3-Selektoren, Schriftart, Rahmenradius, Kastenschatten, Farben und Transformationen hinzu. Sehr gut dokumentiert. Weitere Informationen unter http://ecsstender.org/extensions

DD_roundies von Drew Diller Fügt Unterstützung für Border-Radius und PNG hinzu. Weitere Informationen unter http://www.dillerdesign.com/experiment/DD_roundies/

border-radius.htc von Remiz Rahnas Sehr einfache Unterstützung für border-radius. Weitere Informationen unter http://code.google.com/p/curved-corner/

ie-css3.htc von Nick Fetchak Unterstützung für Rahmenradius und Textschatten. CSS3PIE behauptet, Border-Radius besser zu machen. Weitere Informationen unter http://www.fetchak.com/ie-css3/


3

Hier ist ein schöner Artikel über CSS3 und IE6 aus dem Smashing Magazine: http://www.smashingmagazine.com/2010/04/28/css3-solutions-for-internet-explorer/


3
Dieser Artikel ist eine großartige Einführung in "border-radius.htc", aber zum größten Teil eine Liste von CSS-Filtern, die nur für den Internet Explorer gelten und CSS3-Funktionen imitieren können. Als Webentwickler möchte ich nicht viel alten IE-spezifischen CSS-Code schreiben, sondern mich auf Standard-CSS konzentrieren und den IE darauf reagieren lassen, wie es "border-radius.htc" und "CSS3PIE" tun.
Mawtex

0

Probieren Sie Google Chrome Frame aus . IE-Nutzer, die es installieren, können Ihre Website im Renderer von Google Chrome durchsuchen, ohne den Browser wechseln zu müssen.

BEARBEITEN: Sie können sogar eine von Google bereitgestellte JS-Bibliothek verwenden, um Nutzern, die sie zur Installation von Google Chrome Frame einladen, eine Nachricht anzuzeigen. Bei einer Installation mit nur einem Mausklick muss der Browser wie bei Flash nicht neu gestartet werden. Anschließend wird die Seite aktualisiert.


Ihr Vorschlag ist also, alle Personen, die in Zukunft die Website des Fragestellers mit IE6 / 7/8 besuchen werden, zu erreichen und sie dazu zu bringen, Google Chrome Frame zu installieren, bevor sie sie besuchen? Wäre es nicht einfacher, alle IE-Nutzer der Welt dazu zu bringen, stattdessen auf Chrome zu wechseln?
Nir

@Nir Ich habe bearbeitet, um zu erklären, wie Sie Ihre Benutzer dazu bringen können, GCF mithilfe der JS-Bibliothek von Google zu installieren. Es ist ganz nett.
Dan Fabulich,

Selbst bei einer Installation mit einem Klick (übrigens, unter Vista müssen Sie 5 Sicherheitswarnungen beachten, um Flash zu installieren - so viel für einen Klick) würde ich nicht davon träumen, meine Benutzer aufzufordern, ein Browser-Plugin zu installieren, nur damit ich abgerundete Ecken (und) verwenden kann Ich vermute, es werden nur diejenigen installiert, die meinem Produkt wirklich vertrauen und es mögen (dh diejenigen, die es auch ohne abgerundete Ecken kaufen).
Nir
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.