浮动的子盒子可以margin离开父盒子 

<body>
    <div id="nav">
        <div class="container">
            <div id="logo">123</div>
            <div id="main-nav">124</div>
            <div id="three">123</div>
            <div id="four">125</div>
        </div>

    </div>

</body>

</html>

css

        #nav {
            height: 150px;
            border: 1px solid red;
        }

        .container {
            width: 1000px;
            margin: 0 auto;
        }

        .container #logo {
            width: 120px;
            height: 100px;
            background-color: #dcdcdc;
            margin-top: 20px;
            float: left;


        }

        .container #main-nav,#three,#four {
            width: 120px;
            height: 100px;
            background-color: #dcdcdc;
            float: left;
            margin-left: 40px;
            margin-top: 35px;
        }


        /*global css页面公用样式*/
    </style>

　　

posted @ 2022-04-14 17:40  指针园  阅读(43)  评论(0)    收藏  举报