Heim  >  Artikel  >  Web-Frontend  >  Detailliertes Beispiel eines über CSS implementierten HTML-Hintergrundfarbverlaufs

Detailliertes Beispiel eines über CSS implementierten HTML-Hintergrundfarbverlaufs

高洛峰
高洛峰Original
2017-03-06 16:29:241572Durchsuche

Der HTML-Hintergrundfarbverlauf, den Sie sehen, wird durch CSS erreicht. Ich persönlich finde ihn ziemlich gut und Sie können das Bild deutlich sehen. Screenshot des Effekts:
Detailliertes Beispiel eines über CSS implementierten HTML-Hintergrundfarbverlaufs
Implementierungscode:

Der Code lautet wie folgt:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head> 
<title></title> 
<style type="text/css"> 
.linear{ 
width:100%; 
height:600px; 
FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=##15A216,endColorStr=#fafafa); /*IE*/ 
background:-moz-linear-gradient(top,#15A216,#fafafa);/*火狐*/ 
background:-webkit-gradient(linear, 0% 0%, 0% 100%,from(#15A216), to(#fafafa));/*谷歌*/ 
background-image: -webkit-gradient(linear,left bottom,left top,color-start(0, #15A216),color-stop(1, #fafafa));/* Safari & Chrome*/ 
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=&#39;#15A216&#39;, endColorstr=&#39;#fafafa&#39;); /*IE6 & IE7*/ 
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=&#39;#15A216&#39;, endColorstr=&#39;#fafafa&#39;)"; /* IE8 */ 
} 
</style> 
</head> 
<body> 
<p class="linear"></p> 
</body> 
</html>

Detailliertere Beispiele für den implementierten HTML-Hintergrundfarbverlauf durch CSS sind verwandt. Bitte beachten Sie die PHP-Chinese-Website für Artikel!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn