请问老师,我写的对么

来源:2-4 编程练习

慕米毅

2019-10-17 14:20:25

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>background-clip</title>

    <style type="text/css">

        .border,.padding,.content{/*给最外层的div设置样式*/

            width:300px;height:300px;

            float:left;margin-left:50px;

        }

        a{

            text-decoration:none;

            font-size:30px;

        }

        .div1,.div2,.div3{/*放置背景图片的div样式*/

        

            width:220px;height:200px;

            border:10px solid rgba(0,255,0,0.3);

            padding:50px; 

            background-image:url("http://climg.mukewang.com/582c316e0001fd6507000210.jpg");

            margin-top:50px;

        }

        .border:hover div,.padding:hover div,.content:hover div{

            display:block;

        }

        /*补充代码*/

        .div1{

            background-clip:border-box;

            display:block;

            display:none;

        }

        .div2{

            background-clip:padding-box;

            display:block;

            display:none;

        }

        .div3{

            background-clip:content-box;

            display:block;

            display:none;

        }

    </style>

</head>

<body>

    <div class="border">

        <a href="">border-box</a>                   

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

    </div>

    <div class="padding">

        <a href="">padding-box</a>

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

    </div>

    <div class="content">

        <a href="">content-box</a>             

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

    </div>

</body>

</html>


写回答

1回答

好帮手慕糖

2019-10-17

同学你好,对的哦。效果实现没有问题,继续加油!

祝学习愉快!

0

0 学习 · 40143 问题

查看课程