老师，帮我检查一下

来源：3-2 编程练习

Victor19950925

2019-05-08 22:46:12

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>线性渐变</title>
    <style type="text/css">
    /*此处写代码*/
    *{margin:0;padding:0;}
    section{
        width:300px;
        height:350px;
        float:left;
        margin:30px;
    }
    p{
        width:300px;
        height:50px;
        text-align:center;
        line-height:50px;
    }
    section>div{
        width:300px;
        height:300px;
    }
    .a{
        background:-webkit-linear-gradient(yellow,red);
        background:   -moz-linear-gradient(yellow,red);
        background:     -o-linear-gradient(yellow,red);
        background:        linear-gradient(yellow,red);
    }
    .b{
        background:-webkit-linear-gradient(left,yellow,red);
        background:   -moz-linear-gradient(right,yellow,red);
        background:     -o-linear-gradient(right,yellow,red);
        background:        linear-gradient(to right,yellow,red);
    }
    .c{
        background:-webkit-linear-gradient(left top,yellow,red);
        background:   -moz-linear-gradient(right bottom,yellow,red);
        background:     -o-linear-gradient(right bottom,yellow,red);
        background:        linear-gradient(to right bottom,yellow,red);
    }
    
    
    </style>
</head>
<body>
    <!--此处写代码-->
    <section>
        <p>上下方向渐变</p>
        <div class="a"></div>
    </section>
    
    <section>
        <p>左右方向渐变</p>
        <div class="b"></div>
    </section>
    
    <section>
        <p>对角方向渐变</p>
        <div class="c"></div>
    <section>
</html>

写回答

1回答