Wie kann ich einen browserübergreifenden linearen Farbverlauf erstellen?

Verwendung linearer Farbverläufe über Browser hinweg

Um einen browserübergreifenden linearen Farbverlauf zu erreichen, ist es wichtig, Unterschiede zwischen Browsern zu berücksichtigen. Hier sind die Alternativen für Opera und Internet Explorer (IE):

Opera

background-image:     -o-linear-gradient(right, #0c93C0, #FFF);

Internet Explorer

IE < 10

/*IE7-*/ filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#0c93c0', endColorStr='#FFFFFF', GradientType=0);

/*IE8+*/
-ms-filter: "progid:DXImageTransform.Microsoft.Gradient(startColorStr='#0c93c0', endColorStr='#FFFFFF', GradientType=0)";

IE10

background-image:     -ms-linear-gradient(right, #0c93C0, #FFF);

Ändern auf horizontalen Farbverlauf

Um einen horizontalen Farbverlauf zu erstellen, verwenden Sie die linke oder rechte Richtung anstelle von oben oder unten.

Experimentelle CSS-Präfixe

Beachten Sie, dass experimentelle CSS-Eigenschaften Präfixe verwenden, um den Browser anzugeben, den sie verwenden sind gedacht für:

• -webkit- für Webkit-Browser (Chrome, Safari)
• -moz- für Firefox
• -o- für Opera
• -ms- für Internet Explorer

Microsoft-Verlaufsfilter Syntax

Für IE lautet die -ms-filter-Syntax wie folgt:

-ms-filter: progid:DXImageTransform.Microsoft.Gradient(
    startColorStr='#0c93c0', /*Start color*/
    endColorStr='#FFFFFF',   /*End color*/
    GradientType=0           /*0=Vertical, 1=Horizontal gradient*/
);

GradientType ist optional und kann weggelassen werden.

Das obige ist der detaillierte Inhalt vonWie kann ich einen browserübergreifenden linearen Farbverlauf erstellen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!