Gradient-Unterstützung für IE 8 und unten

Fand ich ein tolles CSS - Farbverlauf-code-generator für eine Seite mein Freund macht, aber es gibt einige Kommentare darunter, die sich mit mir Gedanken machen:

/* For Internet Explorer 5.5 - 7 */
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#cccccc, endColorstr=#ffffff);
        /* For Internet Explorer 8 */
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#cccccc, endColorstr=#ffffff)";    
        background-color: #CCC;

Und in der Antwort:

Empfehle ich dringend, gegen diese! Handeln Sie nicht die gleichen, sind begrenzt, die Leistung beeinträchtigen und verursachen layout-Probleme. Einfach gesagt, seit der IE nicht unterstützt Farbverläufe (und viele andere CSS-Funktionen nativ, ohne filter), verwenden Sie entweder Bilder für den gleichen Effekt (background-image) oder überzeugen Sie Ihren Kunden, dass IE-Benutzer bekommen weniger Erfahrung (wer ernsthaft interessiert Verläufe vs einzelne Farben neben insane 'Designer'?) weil Ihr browser einfach nicht mit dem übereinstimmt, was wir als Entwickler wollen. Es nennt sich graceful degradation und IE sollte keine Ausnahme.

So, was ich nicht weiß ist: Sollte ich schlage vor, Sie tun/benutzen Sie keine dieser code? Immer ist der IE diesen code verwenden sinnlos/hoffnungslos?

InformationsquelleAutor Pureferret | 2012-09-11
  1. 5

    Den filter Zeug ist in der Regel als schlechte Praxis, und ist nicht valid CSS (also der stylesheet-Validierung fehl-tests)

    es ist möglich, ein Hintergrundbild für das element in Frage, dann der IE fallback auf das Bild, wenn es eine version, die nicht unterstützt Gradienten, das schöne daran ist, dass Browser in der Unterstützung von Farbverläufen nicht laden Sie die hintergrund-Bild (naja, meistens), damit die Leistung nicht beeinträchtigt wird negativ.

    Persönlich, wenn ich du wäre würde ich gehen für das Hintergrundbild-Lösung, es ist viel sauberer als der ganze "filter" - Sache, und nicht bestrafen Menschen nicht mit Internet Explorer (yay!)

    Wenn Sie möchten mehr Details, siehe hier:
    http://css-tricks.com/css3-gradients/

    • Gradient images sind nicht eine alternative in den meisten Fällen verwenden, da Sie nicht vergrößern oder verkleinern, passt sich die element, die verwendet werden auf. Wie funktioniert eine filter-Regel zu bestrafen, nicht IE-Benutzer? Wenn Sie wollen, Reiniger/valid CSS-Dateien, die Sie bewegen könnte, diese Regeln in eine separate ie.css. Wo hast du gelesen, dass "Das filter-Zeugs wird in der Regel als schlechte Praxis". Das ist deine persönliche Meinung.
    • Schlechte Praxis ist möglicherweise der falsche Begriff, aber die Filter sind nicht standard und vendor-Präfixe sind. Sie brauchen nur daran zu erinnern, das Präfix für jeden browser, aber, wie die meisten Dinge IE verwandt, Sie haben auf Ihrem Kopf stehen und winken Ihre Arme um die Dinge zu arbeiten.
    • warum die Sorge über IE, aber nicht bei jedem anderen browser, der nicht mit den Steigungen? Ich weiß, es ist schwer zu vorstellen, die Leute, die eine "alternative" browser, aber nicht halten Sie es bis zu Datum, aber ich fing ein Kunde mit einer antiken version von Safari, nur im letzten Jahr. Entweder sind die Informationen der Farbverlauf vermittelt, ist wichtig, oder es ist es nicht (wenn es wichtig ist, was tun Sie für die blind?). Wenn es nicht ist, dann können Sie Sie behandeln wie jeden anderen browser, der nicht mit den Steigungen. Es ist erwähnenswert, dass die IE-Filter arbeiten nur mit 2 Farbmarkierungen.
    • die Besorgnis über IE", Weil alle meine Kunden es als eine Verpflichtung, und zahlen für it. Und nicht ganz schlecht. Aber kein Kunde zahlt für ein Update für Firefox 2. Das ist der ganze Grund, warum freie Marktwirtschaft.
    InformationsquelleAutor Sean
  2. 2

    Ich bin mit http://www.colorzilla.com/gradient-editor/ zum erstellen von CSS-Verläufen. Der produzierte code es funktioniert sogar im IE 6+:

    background: #1e5799; /* Old browsers */
background: -moz-linear-gradient(top, #1e5799 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(50%,#2989d8), color-stop(51%,#207cca), color-stop(100%,#7db9e8)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* IE10+ */
background: linear-gradient(to bottom, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */

    Also ja, Sie könnte verwenden Gradienten in MS IE.

    • Ja ich weiß, dass filter ist nicht Teil der CSS-Spezifikation – aber auf der anderen Seite war der IE 8 ist der erste Microsoft-browser für Windows zur Unterstützung von CSS 2.1. Also, wenn es um styling geht für MS IE ist mir egal, was jeder Spezifikation sagt. Sonst könnte ich nicht erstellen, CSS-layouts für diese Browser. (Dieser Kommentar war eine Antwort, aber der Kommentar wurde gelöscht...)
    • Ich habe das Gefühl feeela die Kommentare. Es ist hart, wenn es einen soll-Spezifikation, noch Browser, vergangene und gegenwärtige, nicht unterstützen, die Angabe ganz. Was ist der Punkt, der Spezifikationen, wenn der Browser erstellt werden, die nicht nach Ihnen? Scheint wie eine Feinheit zu Folgen, aber die Validierung ist nur eine Meinung an diesem Punkt.
    InformationsquelleAutor feeela
  3. 1

    Vier Jahre nachdem die Frage gestellt wurde, das Problem nicht Weg. Ich habe eine Menge von Websites für große Unternehmen, und Sie finden immer noch IE8 auf den corporate desktop, manchmal auch als das Unternehmen standard.

    Meine Empfehlung wäre, diese Zeilen genau so, wie Sie angeboten werden. IE8 wird Sie benutzt, und jeder moderne browser ignorieren Sie. Es hält den designer glücklich, dass Sie die Umsetzung seiner design zum besten des Browsers, aber Sie nicht zu verwirren haben mit gestreiften hintergrund Bilder.

    InformationsquelleAutor Allen
  4. -1
    /* Internet Explorer 5 - 7 */
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#cccccc, endColorstr=#ffffff);
        /* For Internet Explorer 8 */
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#cccccc, endColorstr=#ffffff)";    
        background-color: #CCC;
    • Antworten, die nur code sind nicht sehr hilfreich.
    InformationsquelleAutor Bhushan wagh
Schreibe einen Kommentar