CSS理论：margin-left在float中的运用

源码如下: margin-left 指的是左边的外边距，为正数时，左边间距增大，div向右偏移，为负数时，左边间距减少，相反往左偏移

<head> <meta charset="UTF-8"> <title>双飞翼</title> <style> .wrap { width: 100%; margin: 0 auto; } 
    .left {
        width: 15%;
        height: 700px;
        background: red;
        float: left;
        bottom: 0px;
        /*margin-left: -100%;*/
    }

    .right {
        width: 15%;
        height: 700px;
        background: red;
        float: right;
        /*margin-left: -15%;*/
    }

    .main {
        width: 100%;
        float: left;
        background: pink;
        text-align: center;
    }

    .content {
        height: 700px;
        width: 70%;
        background: yellow;
        margin: 0 auto;
    }
</style>
</head> <body> <div class="wrap"> <div class="main"> <div class="content">content</div> </div> <div class="left">left</div> <div class="right">right</div> </div> </body>
posted @ 2018-12-20 16:22  Blues.huang  阅读(471)  评论(0)    收藏  举报