CSS背景色漸變效果程式碼

admin發表於2017-02-11
CSS
本章節分享一段背景色漸變的效果，希望能夠給大家起到借鑑作用。

程式碼如下:

[HTML] 純文字檢視 複製程式碼執行程式碼
<!DOCTYPE html> 
<html> 
<head> 
<meta charset=" utf-8"> 
<meta name="author" content="http://www.softwhy.com/" /> 
<title>螞蟻部落</title>
<style type="text/css"> 
.antzone{ 
  height:300px; 
  width:100px; 
  margin:0px auto; 
  background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#00FF00),color-stop(1,#FF0000));
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00FF00', endColorstr='#FF0000', GradientType='0'); /*IE*/
} 
</style>
</head>
<body>
<div class="antzone"></div> 
</body>
</html>

以上程式碼實現了漸變效果，但是具有一定的瀏覽器相容性問題，IE10瀏覽器不支援。

相關文章