在flex布局中，是分為主軸和側軸兩個方向即x軸和y軸。1. flex-direction：設定主軸方向預設主軸是x軸 行 row，側軸是y軸 列 column ；我們的元素是根據主軸來排列的。
flex-direction:row;
//設定x軸為主軸（從左到右）
flex-direction:row-reverse;
//翻轉（從右到左），簡單了解
flex-direction:column;
//設定y軸為主軸
flex-direction:column-reverse;
//從下到上
justify-content:flex-start;
//預設值從頭部開始 如果主軸是x軸，則從左到右
justify-content:flex-end;
//從尾部開始排列
justify-content:center;
//在主軸居中對齊
justify-content:space-around;
//平分剩餘空間
justify-content:space-between;
//先兩邊貼邊 再平分剩餘空間 （這個重要）
flex布局中，預設的子元素是不換行的，如果裝不開，會縮小子元素的寬度，放到父元素裡面
flex-wrap:nowrap;
//預設值，不換行
flex-wrap:wrap;
//換行
align-content:flex-start;
//預設值在側軸的頭部開始排列
align-content:flex-end;
//在側軸的尾部開始排列
align-content:center;
//在側軸中間顯示
align-content:space-around;
//子項在側軸平分剩餘空間
align-content:space-between;
//子項在側軸先分布在兩頭，再平分剩餘空間
align-content:stretch;
//設定子項元素高度平分父元素高度
align-items:flex-start
//預設值，從上到下
align-items:flex-end;
//從下到上
align-items:center;
//擠在一起居中（垂直居中）
align-items:stretch;
//拉伸
flex-flow:row wrap;移動web開發 flex布局
container 簡稱 容器 它的所有子元素自動成為容器成員，稱為 flex 專案 flex item 簡稱 專案 總結 就是通過給父盒子新增flex屬性，來控制子盒子的位置和排列方式 flex flow row wrap flex 屬性定義子專案分配剩餘空間，用flex來表示佔多少份數。item...
移動web開發 flex布局
container 簡稱 容器 它的所有子元素自動成為容器成員，稱為 flex 專案 flex item 簡稱 專案 總結 就是通過給父盒子新增flex屬性，來控制子盒子的位置和排列方式 flex flow row wrap flex 屬性定義子專案分配剩餘空間，用flex來表示佔多少份數。item...
移動Web開發 flex布局
1.相容性好 2.布局繁瑣 3.侷限性，不能在移動端很好地布局 1.操作方便，布局極 為簡單，移動端應用很廣泛 2.pc端瀏覽器支援情況較差 3.ie11或更低版本，不支援或僅支援部分 1.如果是pc端介面布局，還是使用傳統布局 2.如果是移動端或者不考慮相容性問題的pc端介面布局，我們還是使用fl...