彈性布局在移動端可以大膽使用，但在pc端使用，如果要相容低版本低版本 ie ，則不能使用彈性布局採用
flex布局的元素，被稱為flex容器，他的直接子元素被稱為flex專案
[外鏈轉存失敗,源站可能有防盜煉機制,建議將儲存下來直接上傳(img-kguifkop-1594006874098)(c:\users\ly\desktop\知了堂學習\第三週\flex.png)]
flex 設定的屬性分為兩部分，一部分作用於容器，被稱為容器屬性，另一部分作用於專案，被稱為專案屬性
我是使用display屬性來定義flex布局
.box
flex-direction屬性設定主軸方向
.box
flex-wrap讓內容換行
.box
flex-flow是flex-direction和flex-wrap的簡寫形式
.box
jistify-content設定主軸方向的內容排列方式以及額外空間的分配方式
.box
align-items設定專案組交叉軸的對齊方式【單行內容】
.box
align-content設定專案組交叉軸的對齊方式【多行內容】
.box
flex安裝**書寫順序排列，但是可以通過order屬性控制專案排列順序
.item
order從小到的排列
flex-grow設定專案的剩餘空間分配比例
.item
flex-shrink設定專案進行縮放時，當空間不夠是，縮小的比例, 0代表不縮放，負值無效
.item
flex-basis設定在分配剩餘空間之前，額外的分配空間
.item
flex是flex-grow、flex-shrink、flex-basis三個的簡寫
align-self設定自身的交叉軸對齊方式
.item
CSS布局之彈性布局
flex 彈性布局 是一種響應式布局，能自動伸縮盒模型達到自適應的效果。彈性布局由彈性容器 flex container 和彈性專案 flex item 組成。在彈性容器中，水平方向稱為主軸 main axis 起點main start,終點main end 垂直方向稱為縱軸 cross axis ...
css布局之彈性布局flex
作用 彈性布局flex能按照我們的設定自動計算各子元素之間的間距並將之布局好，而不需要像定位那樣手動計算布局。彈性布局是定義在乙個父容器中，加上display flex樣式使父容器的布局方式成為彈性布局。父容器中的子元素都會成為行內塊，預設所有子元素橫向排列，子元素的float clear和vert...
CSS之Flex彈性布局
flex彈性布局實現水平垂直居中 父盒子display flex 子盒子margin auto 概念 採用 flex 布局的元素，稱為 flex 容器 flex container 簡稱 容器 它的所有子元素自動成為容器成員，稱為 flex 專案 flex item 簡稱 專案 父容器 displa...