彈性布局;塊元素display:flex;
行內元素display:inline-flex;
設為flex布局後，子元素的float、clear、vertical-align屬性將失效
flex 布局的元素，稱為 flex 容器；它的所有子元素自動成為容器成員，稱為 flex 專案
容器預設存在兩根軸：水平的主軸（main axis）和垂直的交叉軸（cross axis）。主軸的開始位置（與邊框的交叉點）叫做main start，結束位置叫做main end；交叉軸的開始位置叫做cross start，結束位置叫做cross end
flex-direction：決定主軸方向（即專案排列方向），預設水平flex-wrap：定義如果一條軸線放不下，如何換行
flex-flow：flex-direction和flex-wrap的縮寫，預設為row nowrap
justify-content：定義專案在主軸上的對齊方式
align-items：定義專案在交叉軸上的對齊方式
align-content：定義多條軸線的對齊方式，如果只有一條軸線，該屬性不起作用
order：定義專案的排列順序，數值越小，排列越靠前，預設為0flex-grow：定義專案的放大比例，預設為0，（即如果存在剩餘空間，也不放大）
flex-shrink：定義專案的縮小比例，預設為1，（即如果空間不足，該專案縮小）
flex-basis：定義了在分配剩餘空間之前，專案佔據的主軸空間，瀏覽器根據這個屬性，計算是否有剩餘空間。預設值為auto，即專案的本來大小
flex：flex-grow、flex-shrink、flex-basis的縮寫，預設值為0 1 auto不放大可縮小。該屬性有兩個快捷值：auto(1 1 auto)和none(0 0 auto)
align-self：允許單個專案有與其他專案不一樣的對齊方式，可覆蓋align-items,預設值為auto，即繼承父元素的align-items
flex布局基本概念
box sizing box sizing content box 寬高只是內容的寬高，加入邊框和內邊距向外擴張 box sizing border box 寬高是總盒子的寬高，加入邊框和內邊距向內壓縮。flex布局 採用flex布局的元素，成為flex容器 box flex容器的所有子元素自動成為...
flex布局概念及屬性
flex是flexible box的縮寫，意為 彈性布局 用來為盒狀模型提供最大的靈活性。是css3的新布局方式，父元素是容器，子元素叫專案 任何乙個容器都可以指定為flex布局。box行內元素也可以使用flex布局。boxwebkit核心的瀏覽器，必須加上 webkit字首。box注意 設為fle...
flex布局 Flex布局
摘要 flex布局主要思想是讓容器有能力讓其子專案能夠改變其寬度 高度 甚至順序 以最佳方式填充可用空間 主要是為了適應所有型別的顯示裝置和螢幕大小 作者 星星 flex 是 flexible box 的縮寫，意為 彈性布局 flex布局主要思想是讓容器有能力讓其子專案能夠改變其寬度 高度 甚至順序...