30分鐘徹底弄懂flex佈局

轉載 30分鐘徹底弄懂flex佈局

目前在不考慮IE以及低端安卓機（4.3-）的兼容下，已經可以放心使用flex進行佈局了。什麼是flex佈局以及它的好處，這裏就不再贅述。

在這篇文章裏，想說說flex佈局的屬性語法及其細節。那麼網上也有不少flex佈局的教程，爲什麼又要再寫一篇？

首先，flex佈局的迷之屬性們，如果一知半解，機械記憶的話，那不到半個月基本忘光光。先感受一下這12個flex佈局屬性，是不是很“迷”人。

容器屬性

flex-flow
flex-direction
flex-wrap
justify-content
align-items
align-content

元素屬性

order
flex-grow
flex-shrink
flex-basis
flex
align-self

就連老外也都在twitter吐槽不好理解，可見還是有一定的學習成本。