3-17请检查

来源:3-17 编程练习

brown_one

2020-08-19 18:15:18

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>径向渐变</title>

    <style type="text/css">

        div{

            width:200px;height:300px;

            float:left;

            margin:100px 0 0 100px;                                  

        }

        /*补充代码,分别写出4个元素的背景渐变效果*/

        div.div1{

            background:-webkit-radial-gradient(60% 40%, closest-side circle, red, yellow, green, blue);

            background:-moz-radial-gradient(60% 40%, closest-side circle, red, yellow, green, blue);

            background:-o-bradial-gradient(60% 40%, closest-side circle, red, yellow, green, blue);

            background:radial-gradient(60% 40%, closest-side circle, red, yellow, green, blue);

        }

        div.div2{

            background:-webkit-radial-gradient(60% 40%, farthest-side circle, red, yellow, green, blue);

            background:-moz-radial-gradient(60% 40%, farthest-side circle, red, yellow, green, blue);

            background:-o-radial-gradient(60% 40%, farthest-side circle, red, yellow, green, blue);

            background:radial-gradient(60% 40%, farthest-side circle, red, yellow, green, blue);}

        div.div3{

            background:-webkit-radial-gradient(60% 40%, closest-corner circle, red, yellow, green, blue);

            background:-moz-radial-gradient(60% 40%, closest-corner circle, red, yellow, green, blue);

            background:-o-radial-gradient(60% 40%, closest-corner circle, red, yellow, green, blue);

            background:radial-gradient(60% 40%, closest-corner circle, red, yellow, green, blue);}

        div.div4{

            background:-webkit-radial-gradient(60% 40%, farthest-corner circle, red, yellow, green, blue);

            background:-moz-radial-gradient(60% 40%, farthest-corner circle, red, yellow, green, blue);

            background:-o-radial-gradient(60% 40%, farthest-corner circle, red, yellow, green, blue);

            background:radial-gradient(60% 40%, farthest-corner circle, red, yellow, green, blue);}

    </style>      

</head>

<body>

    <div class="div1"></div>  

    <div class="div2"></div>       

    <div class="div3"></div>  

    <div class="div4"></div>  

</body>

</html>


写回答

1回答

好帮手慕久久

2020-08-19

同学你好,代码正确,很棒,祝学习愉快!

0

0 学习 · 40143 问题

查看课程