如何让六个小li顺利在红色盒子里

小黄练编程 · 发表于 2022-3-12 12:17:44

马上注册，结交更多好友，享用更多功能^_^

您需要登录才可以下载或查看，没有账号？立即注册

x

<!doctype html>
<html>
<head>
    <title></title>
    <meta charset="utf-8">
    <style>
    
        .kuai{
            width:1920px;
            height:767px;
            margin:0 auto;
        }
        .kuai .box1{
            width:1202px;
            height:767px;
            background-color:aqua;
        }
        .kuai .box2{
            width:870px;
            height:679px;
            background-color:red;
        }
        .kuai .box2 ul li{
            width:273px;
            height:306px;
            margin-right:px;
            margin-bottom:40px;
            list-style-type:none;
            display:inline-block;
            float:left;
            background-color:pink;
        }
        .kuai.box3{
            width:300px;
            height:679px;
            /* float:right; */
            background-color:yellow;
        }
        .margin_right{
            margin-right:0px;
        }
    </style>
</head>
<body>
    <div class="kuai">
        <div class="box1">
            <div class="box2">
                <ul>
                    <li><img></li>
                    <li><img></li>
                    <li class="margin_right"><img></li>
                    <li><img></li>
                    <li><img></li>
                    <li class="margin_right"><img></li>
                </ul>
            </div>
            <div class="box3"></div>
        </div>
</body>
</html>

_帅 · 发表于 2022-3-13 14:27:09

同学，你描述不太清楚。推荐使用flex布局。或者给ul一个伪类样式来清浮动。

账号		自动登录	找回密码
密码			立即注册