老师 我的代码还有什么需要改进的吗

来源:2-9 编程练习

慕仙0240544

2022-06-24 15:50:00

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</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 h3:hover+div {

               display: block;

             

               background-size: 100px 100px;        

        }

        .percent h3:hover+div {

               display: block;

               background-size: 50% 50%;        

        }

        .cover h3:hover+div {

               display: block;

               background-size: cover;        

        }

        .contain h3: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回答

好帮手慕久久

2022-06-24

同学你好,代码正确,不需要优化了,祝学习愉快!

0

前端工程师

前端入门如同写字,如果你不知道从哪开始,那就选择前端(含Vue3.x,React17,TS)

20327 学习 · 17877 问题

查看课程