老师检查下我代码,不用兄弟选择器+或者> 的话行么

来源:2-11 编程练习

宝慕林4199460

2019-05-09 18:38:34

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>background-size</title>

    <style type="text/css">

        a{text-decoration:none;}

        ul{list-style:none;}

        div{

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

            width:100px;height:100px;

            display:none;border:2px solid red;

            background-repeat:no-repeat;

        }          

        .length:hover div{

            display:block;

            background-size:100px 100px;

        }

        .percent:hover div{

            display:block;

            background-size:50% 50%;

        }

        .cover:hover div{

            display:block;

            background-size:cover;

        }

        .contain:hover div{

            display:block;

            background-size:contain;

        }

    </style>

</head>

<body>

    <h2>background-size不同属性值不同效果</h2>

    <ul>

        <li  class="length">

            <h3><a href="">100px 100px</a></h3>

            <div></div>

        </li> 

        <li  class="percent">

            <h3><a href="">50% 50%</a></h3>

            <div></div>

        </li> 

        <li  class="cover">

            <h3><a href="">cover</a></h3>

            <div></div>

        </li> 

        <li  class="contain">

            <h3><a href="">contain</a></h3>

            <div></div>

        </li> 

    </ul>

</body>

</html>


写回答

1回答

好帮手慕糖

2019-05-09

同学你好,实现没有问题,不用兄弟选择器也是可以的哦。

祝学习愉快!

0

0 学习 · 40143 问题

查看课程