css3背景颜色渐变 

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html;charset=utf-8">
        <title>Linear一下，你就知道</title>
        <style type="text/css">
            html,body{margin: 0;padding: 0; height: 100%;}
            div{width: 33.3%;height: 100%; float: left;}
            .div1{
                background-image: -webkit-linear-gradient(top, #8fa1ff, #3757fa); 
                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c6ff00', endColorstr='#538300', GradientType='0'); 
            }
            .div2{
                background-image: -webkit-linear-gradient(top,#ff4f02,#8f2c00);
                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c6ff00', endColorstr='#538300', GradientType='0'); 
            }
            .div3{
                background-image: -webkit-linear-gradient(top,#ccc,#000);
                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c6ff00', endColorstr='#538300', GradientType='0'); 
            }
        </style>
    </head>
    <body>
        <div class=div1 ></div>
        <div class=div2 ></div>
        <div class=div3 ></div>
    </body>
</html>

 

posted @ 2013-07-02 14:52  microsoft_kk  阅读(630)  评论(0)  编辑  收藏  举报