工作路上的坑--002

flex布局 三个div 两个左对齐 一个右对齐 一、问题 有一个盒子flex布局，子元素有 三个div，在不改变dom结构的情况下，实现 前两个左对齐 第三个右对齐。 二、实现方案 在flex布局中如果某个元素的margin为auto，那么它的margin将会自动填充为 剩下的空间。

 

    <div class="box">
        <div class="block">
        </div>
        <div class="block">
        </div>
        <div class="block" style="margin-left: auto;">
        </div>
    </div>
    <style>
    .box {
        display: flex;
        justify-content: flex-start;
    }

    .block {
        width: 100px;
        height: 100px;
        background-color: black;
    }
    </style>

 

原文: https://blog.csdn.net/KangTongShun/article/details/109055197