Ausführliche Erklärung zum Schreiben von Farbverläufen, die mit mehreren Browsern kompatibel sind

Um mit mehreren Browsern kompatibel zu sein, müssen Sie für jeden Browser ein entsprechendes CSS schreiben. Browser mit einer zu niedrigen Version können nur Bilder als Hintergrund verwenden. Das Folgende ist die Unterstützung von Farbverläufen durch die aktuellen fünf Browser. Es kommt oft vor, dass wir Verlaufshintergründe verwenden müssen, die etwas zu unbescheiden sind. Um mit mehreren Browsern kompatibel zu sein, müssen wir für jeden Browser entsprechendes CSS schreiben. Als Hintergrund können nur Bilder verwendet werden.
Das Folgende ist die aktuelle Unterstützung für Farbverläufe in den fünf wichtigsten Browsern

Der Code lautet wie folgt:

<style type="text/css" media="screen"> 
#gradient { 
width: 200px; 
height: 200px; 
/* 如果浏览器不支持渐变，使用图像作为背景 */ 
background: url(gradient.jpg); 
/* Webkit: Safari 4-5, Chrome 1-9 */ 
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ff6600), to(#339900)); 
/* Webkit: Safari 5.1+, Chrome 10+ */ 
background: -webkit-linear-gradient(top, #ff6600, #339900); 
/* Firefox 3.6+ */ 
background: -moz-linear-gradient(top, #ff6600, #339900); 
/* Opera 11.10+ */ 
background: -o-linear-gradient(top, #ff6600, #339900); 
/* IE 10 */ 
background: -ms-linear-gradient(top, #ff6600, #339900); 
/* IE < 10 */ 
/* 注意：这一行必须写在最后 */ 
FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr=#ff6600, endColorStr=#339900);} 
</style>

Der Code lautet wie folgt:

<p id="gradient"></p>

Wann gab es keinen IE6, wann gilt die Welt als friedlich? Verdammter IE.

【Verwandte Empfehlungen】

1. Besondere Empfehlung: „php Programmer Toolbox“ V0.1 Version herunterladen

2. Kostenloses CSS-Online-Video-Tutorial

3. php.cn Dugu Jiujian (2) - CSS-Video-Tutorial

Vertiefendes Verständnis von CSS3-Verläufen (Verläufe)

Das obige ist der detaillierte Inhalt vonAusführliche Erklärung zum Schreiben von Farbverläufen, die mit mehreren Browsern kompatibel sind. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!