1.相對定位：relative
使用後仍在文件流中，參照物相對於原來的位置進行定位，會壓在其他的元素上面
作用：為絕對定位提供參照物
使用後脫離文件流，後續元素會在絕對定位的前序元素的後面，預設寬度是內容寬度，
參照物是第乙個定位元素的根元素或者外層元素，如果根元素沒有定位元素，那麼參照物
是body。（實際應用：輪播圖，通過相對定位背景圖和絕對定位標題，輪播按鈕結合）
脫離文件流，預設寬度是文字寬度，參照物件：瀏覽器視窗
（實際應用：固定頂欄，廣告等）
float：left/right 向左/右浮動3.清除浮動：
使用浮動後，父級元素沒有高度，頁面會坍塌，清楚浮動能解決這個問題
只需要給浮動內容的父級新增乙個類名即可。
.clearfix:after1.flex-direction 設定主軸對齊方式，有四個屬性
row（預設值）：主軸為水平方向，起點在左端。
row-reverse：主軸水平，起點在右。
column：主軸垂直，起點在上。
column-reverse：主軸垂直，起點在下。
nowrap（預設值）：預設不換行（如果子元素超過 父元素的寬度或者高度會自動在主軸方向壓縮）
wrap：換行，第二行在第一行下面，從左往右。
wrap-reverse：換行，第二行在第一行 上面，從左往右。
4.justify-content 子元素在主軸對齊方式
flex-start（預設值）：左對齊。
flex-end：右對齊。
center：居中。
space-between：兩端對齊，專案之間的間隔都相等。
space-around:每個專案兩側的間隔相等。所以專案之間的間隔比專案與邊框的間隔大一倍
stretch（預設值）：如果專案未設定高度或設為auto，將佔滿整個容器的高度。
flex-start：交叉軸的起點對齊。
flex-end：交叉軸的終點對齊。
center：交叉軸的中點對齊。
baseline: 專案的第一行文字的基線對齊。
stretch（預設值）：軸線佔滿整個交叉軸。
flex-start：與交叉軸的起點對齊。
flex-end：與交叉軸的終點對齊。
center：與交叉軸的中點對齊。
space-between：與交叉軸兩端對齊，軸線之間的間隔平均分布。
space-around：每根軸線兩側的間隔都相等。所以，軸線之間的間隔比軸線與邊框的間隔大一倍。
1.order子元素排列的位置預設是按照html先後順序來排列的，html結構誰在前面預設就排列在前面；order的作用就是改變子元素排列順序order：預設（0） 值越小越靠前
2.flex-grow 比例放大，預設是0，當前放大空間的時候，值越大，放大的比例越大 flex-grow:0
3.flex-shrink 縮小比例，預設是1，值越大，縮小的時候比例越小
4.flex-basis 屬性定義了再分配多餘空間之前，專案佔據的主軸空間（main size）。瀏覽器根據這個屬性，計算主軸是否有多餘空間，它的預設值為auto，即專案的本來大小。
5.flex 是flex-grow, flex-shrink 和 flex-basis的簡寫，預設值為0 1 auto。後兩個屬性可選。
6.align-self 允許單個專案有與其他專案不一樣的對齊方式，可覆蓋align-items屬性。預設值為auto，表示繼承父元素的align-items屬性，如果沒有父元素，則等同於stretch。
.item（原作者位址）
定位 絕對定位
span元素 輸出 1.開啟絕對定位，會使元素脫離文件流 2 開啟絕對定位以後，如果不設定偏移量，則元素的位置不會發生變化 3 相對於瀏覽器視窗進行定位 開啟box3的定位並把box2作為box3的子元素 box2 box3 輸出 若有祖先元素開啟了定位 一般情況，開啟了子元素的絕對定位都會同時開啟...
相對定位，絕對定位
絕對定位是相對于父標籤決定位置，一般用於相對定位標籤裡面，js特效經常用到。相對定位是相對於上乙個相對定位的。一般用於浮動定位標籤裡面，一般跟絕對定位配合使用。浮動定位才是常用的。看例子 以下只說id名代表div 絕對定位 position absolute 如果bq1 絕對定位 外面沒有div等父...
相對定位 絕對定位
相對定位 相對自身位置進行定位 定位後 元素脫離文件流 原來的位置沒有被其他元素所佔據 元素特點沒有發生變化 top 移動後的位置距離起始位置 上面多遠 往下移動 left 移動後的位置距離起始位置 左邊多遠 往右移動 right 移動後的位置距離起始位置 右邊多遠 往左移動 bottom 移動後的...