FLEX布局
| css | style | 备注 |
|---|---|---|
| fl | display:flex; flex-direction:row; | |
| fv | display:flex; flex-direction:column; | |
| frr | flex-direction: row-reverse; | |
| fcr | flex-direction: column-reverse; | |
| fs | flex-shrink:1; | |
| fs-0 | flex-shrink:0; | |
| fg | flex-grow:1; | |
| fg-0 | flex-grow:0; | |
| fasa | align-self: auto; | |
| fasc | align-self: center; | |
| fass | align-self: flex-start; | |
| fase | align-self: flex-end; | |
| fasb | align-self: baseline; | |
| fasst | align-self: stretch; | |
| faic | align-items: center; | |
| fais | align-items: flex-start; | |
| faie | align-items: flex-end; | |
| faib | align-items: baseline; | |
| faist | align-items: stretch; | |
| facc | align-content: center; | |
| facs | align-content: flex-start; | |
| face | align-content: flex-end; | |
| facb | align-content: baseline; | |
| facst | align-content: stretch; | |
| fjcs | justify-content: flex-start; | |
| fjce | justify-content: flex-end; | |
| fjcc | justify-content: center; | |
| fjcb | justify-content: space-between; | |
| fjca | justify-content: space-around; | |
| fjcse | justify-content: space-evenly; | |
| fww | flex-wrap: wrap; | |
| fwn | flex-wrap: nowrap; | |
| fwwr | flex-wrap: wrap-reverse; | |
| bzn | box-sizing: none; | |
| bzb | box-sizing: border-box; | |
| bzx | box-sizing: content-box; |