首页>>图形网页>>CSS滤镜实现网页渐变色背景效果
CSS滤镜实现网页渐变色背景效果
来源: csdn 时间: 2015-03-03 17:59:58

CSS通过滤镜实现背景渐变效果,兼容各主流浏览器。

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

<meta name="format-detection" content="telephone=no">

<meta name="apple-mobile-web-app-status-bar-style" content="black">

<style>

.linear{   

    width:100%;   

    height:auto;   

    FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#CD6D2E,endColorStr=#E2C059); /*IE*/   

    background:-moz-linear-gradient(top,#CD6D2E,#E2C059);/*火狐*/   

    background:-webkit-gradient(linear, 0% 100%, 0% 0%,from(#E2C059), to(#CD6D2E));/*谷歌*/   

  

      

    background-image: -webkit-gradient(linear,left bottom,left top,color-start(0, #E2C059),color-stop(1, #CD6D2E));/* Safari & Chrome*/  

    filter:  progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#E2C059', endColorstr='#CD6D2E'); /*IE6 & IE7*/  

    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#CD6D2E', endColorstr='#E2C059')"; /* IE8 */  

  

}

</style>

<title>首页</title>

</head>

<body>

<div class="linear" style="height:390px;">

</div>

</body>

</html>

本页地址:http://www.easytd.com/tuxingwangye/d_15030317337.html

本页地址:

上一篇:CSS中height:100%(高度设置为100%)无效的解决方案 下一篇:Javascript eval()函数执行表达式