CSS----利用flex 圣杯布局 双飞翼布局

介绍两个布局中使用的flex属性
order: 根据值来进行排序 可为负值
box-grow: grow意为成长 可以使 items增长
flex: (flex-grow||flex-shrink||flex-basis)
圣杯布局：

  <style>
        .container{
    
            width: 100%;
            display: flex;
        }
        .left,.right,.center{
    
            min-height: 150px;
        }
        .left{
    
              background-color: blue;
              width: 200px;
              order: -1;
        }
        .right
        {
     
               background-color: antiquewhite;
               width: 300px;
        }
        .center