flex布局

flex-direction： row column  主轴方向

jutisfy-content:  center flex-end flex-start 沿主轴方向

align-items center  沿侧轴方向

.box {
  display: flex
}

.box {
  display:flex;
  justify-content: center; 
}

.box {
    display:flex;
    justify-content: flex-end;
}

.box {
    display：flex;
    align-items:center;
}

.box {
    display: flex;
    align-items:center;
    justify-items:center;
  }

.box{
display:flex;
align-items: flex-end;
justify-content:center;
}

.box {
 display: flex;
 align-items:flex-end;
 justify-content: flex-end;
}

.box{
    display: flex;
    justify-content: space-between;
}
.box {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.box {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

.box {
    display:flex;
    flex-direction: column;
    justify-content: space-between;
}

.box {
    display: flex;
 }

.box:nth-child(2) {
    align-self: center;
}

.box {
    display:flex;
    justify-content: space-between;
}

.box:nth-child(2) {
    align-self: flex-end;
}


.box {
    display:flex;
}

.box:nth-child(2) {
  align-self: center;
}

.box:nth-child(3) {
  align-self：flex-end;
}


.box{
  diplsy: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-content: space-between;
}

.box{
 display: flex;
 flex-wrap: wrap;
 align-content: space-between;
}

.column{
    flex-basis: 100%;
    display: flex;
    justify-content: space-between;
}

.box{
  diaplay: flex;
  flex-wrap: wrap;
 align-content: space-between;
}

.box{
    display:flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-conent: space-between;
}

.box {
  display: flex;
  flex-wrap: wrap;
}


.row {
  flex-basis: 100%;
    display: flex;
}

.row:nth-child(2) {
    justify-content: center;
}

:row:nth-child(3) {
    justify-ceontent: space-between; 
}

.box {
    display: flex;
   flex-wrap: wrap;
 }

<div class="grid">
    <div class="grid-cell">...</div>
    <div class="grid-cell">...</div>
    <div class="grid-cell">...</div>
 </div>

.grid{
  display:flex;
}

.grid-cell {
   flex: 1;
}