css彈性盒子flex的基本用法；
在介紹flex之前，大家先想一下，我們之前用html時布局都是怎麼來寫的，是不是大致分為三部分，左中右，左右部分用padding或者margin值來撐開，中間部分寬度自適應，大概如下圖所示：
這是我們最常見的 在html中 一般就是左右絕對定位 兩邊距離用padding-left和padding-right來設定，中間寬度100%；
css對於元素的顯示方式display有多種屬性值可取，知道基本的block、inline-block、inline屬性值，設定浮動、定位、margin和padding的值可以很好地對元素進行布局，在設定垂直居中時，常常是採用設定邊距的方法來實現，這樣很難達到想要的效果，除此之外，如果想要元素對於不同的顯示寬度進行排版的自動變換，想要實現也是很困難。這個時候，對元素顯示方式設定flex屬性值，再對元素及內容進行設定，可以很方便的達到這樣的要求。
活不多說 上**
11111
22222
33333
flex-start ：緊挨開頭依次填充，為預設值。
center ：居中，如果兩側空間不足，則兩側同時溢位。
flex-end ：緊挨尾部依次填充。
space-between ：如果剩餘空間為負或者只有乙個彈性項，則該值等同於flex-start
space-around ：平均分布在該行中，兩邊各留一半間隔空間
例：center的用法：
11111
22222
33333
align-items屬性：align-items設定或檢索彈性盒子元素在側軸（縱軸）方向上的對齊方式。
flex-wrap 屬性：flex-wrap 屬性用於指定彈性盒子的子元素換行方式。
align-content 屬性：align-content 屬性用於修改 flex-wrap 屬性的行為。類似於 align-items, 但它不是設定彈性子元素的對齊，而是設定各個行的對齊。
align-self：align-self 屬性用於設定彈性元素自身在側軸（縱軸）方向上的對齊方式。
CSS 彈性盒子Flex
剛接觸flex三天，特總結並記錄一下。flex感覺就是排版布局的神器。好吧剛接觸前端，原諒我一次孤陋寡聞 參考文章 要使用flex布局，需要設計到兩層，外面一層叫做flex容器 flex container 簡稱 容器 它的所有子元素自動成為容器成員，稱為flex專案 flex item 簡稱 專案...
Flex布局（CSS彈性盒子）
css3彈性盒子 flexible box或flexbox 是一種用於在頁面上布置元素的布局模式，使得當頁面布局必須適應不同的螢幕尺寸和不同的顯示裝置時，元素可 地執行。對於許多應用程式，彈性盒子模型提供了對塊模型的改進，因為它不使用浮動，flex容器的邊緣也不會與其內容的邊緣摺疊。摘自mdn 使用...
css 彈性盒子 flex 的使用
前言 這是筆者學習之後自己的理解與整理。如果有錯誤或者疑問的地方，請大家指正，我會持續更新！css3引入了一種新的布局模型 flex 布局。flex是 flexible box 的縮寫，一般稱之為彈性盒模型。flex布局提供一種更加有效的方式來進行容器內的專案布局，以適應各種型別的顯示裝置和各種尺寸...