彈性盒模型flexbox
彈性盒模型是c3的一種新的布局模式
它是指一種當頁面需要適應不同螢幕大小以及裝置型別時，確保元素有恰當行為的布局方式。
引入彈性盒模型布局的目的是提供一種更有效的方法來對乙個容器中的子元素進行排列、對齊和分配空白空間。
相容性ie11
彈性盒模型內容
彈性盒模型由彈性容器（flex container）和彈性子 元素（flex item）組成
將父容器設定display:flex轉換為彈性容器
介紹幾個常用方法：
flex-direction:row:橫向從左到右排列，預設
row-reverse:橫向從右到左排列（最後一項在最前面）
column:縱向排列
column-reverse:反轉縱向排列（最後一項排在最上面）
justify-content:讓盒子水平垂直居中的方法：flex-start:起始點對齊（左對齊）
flex-end:終止點對齊（右對齊）
center:居中對齊
space-around:四周環繞
space-between:兩端對齊
1 使用彈性盒模型 display:flex +justify-content:center + align-items:center
2 使用position:absolute + transform:translate
.box.child
學習CSS盒模型和CSS3彈性盒模型
css盒模型本質是乙個盒子，封裝周圍的html元素，它包括 邊距，邊框，填充，和實際內容。盒模型允許我們在其它元素和周圍元素邊框之間的空間放置元素。div300px 寬 50px 左 右填充 50px 左 右邊框 50px 左 右邊距 450px 最終元素的總寬度計算公式是這樣的 總元素的寬度 寬度...
理解CSS彈性盒模型flex
css3引入了一種新的布局模型 flex布局。flex是flexible box的縮寫，一般稱之為彈性盒模型。和css3其他屬性不一樣，flexbox並不是乙個屬性，而是乙個模組，包括多個css3屬性。flex布局提供一種更加有效的方式來進行容器內的專案布局，以適應各種型別的顯示裝置和各種尺寸的螢幕...
css3 彈性盒模型
1.box flex 定義盒子的彈性空間 子元素的尺寸 盒子的尺寸 子元素的box flex屬性值 所有子元素的box flex屬性值的和 例題 中間寬度固定，兩側寬度自適應 box div nth of type 1 box div nth of type 2 box div nth of typ...