flex布局 三个div 两个左对齐 一个右对齐

一、问题

有一个盒子flex布局，子元素有 三个div，在不改变dom结构的情况下，实现 前两个左对齐 第三个右对齐。

二、实现方案

在flex布局中如果某个元素的margin为auto，那么它的margin将会自动填充为 剩下的空间。

三、代码如下

    
    
    



    
块1
    
块2
     // 此地margin-left:auto；自动填充了剩余空间
    
块3
 
    
块4

效果如下：

参考链接：https://blog.csdn.net/KangTongShun/article/details/109055197