南寧小程序開發,挑戰百日學習計劃第26天(flex彈性佈局)

想不到堅持了那麼久,往年的話這個時候我早就放棄了 哈哈,寫日記對於一個程序員的進步來說,還是很實在的。現在每天在辦公室吹着空調學習,感覺賊帶勁! 還有小劉同學的陪伴 哈哈 舒服.

【南寧小程序開發: zkelm.com】

步入正題:我剛剛搞清楚了display的定位,float等,結果發現css的彈性佈局纔是主流,哎!前端真是要一直奔跑啊,頭都大了
我做事一絲不苟的態度,還是很費神的,不過小劉同學說得對,幹就完了!
花個一兩天把彈性佈局學透,前端不就七七八八了嘛 哈哈,南寧小程序開發,挑戰百日學習計劃第25天(css 選擇器)一個大神即將閃亮登場

display:flex 

在這裏插入圖片描述

基本概念

1.flex container 只要display設置了flex 則,此元素就會變成一個flex container 彈性容器
2.main axis 水平主軸 main start main end
3.cross axis 交叉軸 cross start cross end

容器的基本屬性(6個)

1.flex-directive 容器的方向
flex-direction:row (水平 從左到右)
flex-direction:row-reverse (水平。從右到左)
flex-direction:column (垂直 由上到下)
flex-direction:column-reverse (垂直 由下到上)

在這裏插入圖片描述

未完待續!

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章