Wie man IE CSS3 unterstützen

June 30

Cascading Style Sheets (CSS) ist das Look And Feel von Websites und CSS3-Steuerelement der neuesten Spezifikation für CSS. Während CSS3 Features wie Farbverläufe, Schlagschatten und abgerundeten Ecken hinzufügt, unterstützen Internet Explorer (IE) Versionen 6 bis 8 nicht CSS3 überhaupt. Hinzufügen einer Poly-füllen-Datei--eine HTC-Datei, die "die Unterstützung IE füllt" fehlt--zu Ihrer Web Site erlaubt Ihnen, einige grundlegenden CSS3-Eigenschaften verwenden. Von den paar CSS3 Poly-Füllungen, die vorhanden sind, ist das Beste visuelle Effekte hinzufügen verwenden CSS3 PIE (Progressive Internet Explorer).

Anweisungen

1 Gehen Sie zu CSS3pie.com und download CSS3 PIE, ein Poly-füllen-Skript, das begrenzte CSS3-Unterstützung für Ihre Website hinzufügt, wenn Besucher in Internet Explorer-Versionen 6 bis 8 zu laden. Entpacken Sie CSS3 PIE auf Ihrem Computer und laden Sie sie auf Ihrem Webserver, wenn Ihre Website bereits online ist.

2 Öffnen Sie die CSS-Datei Ihrer Website zugeordnet. In CSS-Selektoren wie "#mydiv" oder "Tagname", zusammen mit der Eigenschaft-Wert-Paare zwischen den geschweiften Klammern bilden Stilregeln. Fügen Sie diesen Code in jeder Stilregel, CSS3-Eigenschaften enthält:

Verhalten: URL(path/to/PIE.htc);

"Path/to/PIE.htc" den Speicherort der Datei PIE.htc entsprechend ändern.

3 Suchen Sie alle linearen Farbverlauf in der CSS-Datei und schreiben Sie eine neue Eigenschaft-Wert-Paar:

-Torte-Hintergrund: linear-gradient(top, #ffffff, #000000);

Das oben genannte paar ersetzt andere nicht in Ihrem Code. Dies ist ein zusätzliches Paar, das Unterstützung für CSS3 PIE nur. Verwenden Sie nicht "- Pie - Hintergrund-Bild." Ändern Sie die Werte für den Farbverlauf, wie Richtung oder die Farben des Farbverlaufs übereinstimmen, die Sie verwenden möchten.

4 Ändern Sie alle RGBa (rot, grün, blau und Alpha)-Farb-Code in den CSS3 in Hexadezimal. CSS3 PIE Poly-Fill kann die Farbwerte im RGBa aber die Farben mit jeder Transparenz wird nicht gerendert. Lassen Sie einen RGBa-Wert, alleine, wenn die Farbe nicht schlecht wenn deckend gerendert aussehen wird.

Tipps & Warnungen

  • Sie können viele CSS3-Effekte mit JavaScript Fallbacks erzielen. Diese Fallbacks hinzufügen aber oft nur einen Effekt zu einem Zeitpunkt.
  • Betrachten Sie, so dass Ihre Website zu anmutig in älteren Browsern zu erniedrigen. Dies bedeutet, dass zwar einige Benutzer nicht abgerundeten Ecken oder Verläufen angezeigt werden, können sie immer noch lesen und der Website benutzen.
  • CSS3 PIE funktioniert am besten mit regelmäßigen, "statische" HTML-Websites. Bei Anwendung auf Vorlagen oder Themen für dynamischen Content Managementsysteme (CMS) die Poly-füllen-Datei funktioniert nicht immer oder kann sich auf seltsame Weise Verhalten.
  • Diese Technik wird nicht spiegeln von Text-Unterstützung für Ihre Website hinzufügen. Sie sollten überprüfen, dass die Farbe Ihres Textes nicht Lesbarkeit beeinträchtigt, wenn der Schatten fehlt.