每天進步一點點 flex布局

2021-10-21 10:24:53 字數 987 閱讀 9362

webkit 核心的瀏覽器,必須加上-webkit字首。

.box
注意,設為 flex 布局以後,子元素的float、clear和vertical-align屬性將失效。

有4個值:

如果元素在一行內排滿,且多出來的被隱藏掉,可以設定 flex-wrap來換行。

有3個值:

flex-flow: || ;
它可能取5個值,具體對齊方式與軸的方向有關。下面假設主軸為從左到右。

flex-start(預設值):左對齊

flex-end:右對齊

center: 居中

space-between:兩端對齊,專案之間的間隔都相等。

space-around:每個專案兩側的間隔相等。所以,專案之間的間隔比專案與邊框的間隔大一倍。

它可能取5個值。具體的對齊方式與交叉軸的方向有關,下面假設交叉軸從上到下。

flex-start:交叉軸的起點對齊。

flex-end:交叉軸的終點對齊。

center:交叉軸的中點對齊。

baseline: 專案的第一行文字的基線對齊。

stretch(預設值):如果專案未設定高度或設為auto,將佔滿整個容器的高度。

該屬性可能取6個值。

flex-start:與交叉軸的起點對齊。

flex-end:與交叉軸的終點對齊。

center:與交叉軸的中點對齊。

space-between:與交叉軸兩端對齊,軸線之間的間隔平均分布。

space-around:每根軸線兩側的間隔都相等。所以,軸線之間的間隔比軸線與邊框的間隔大一倍。

stretch(預設值):軸線佔滿整個交叉軸。

//  外層

display: flex;

flex-wrap: wrap;

// 裡層

width:49%;

每天進步一點點

很多朋友總喜歡問 成功靠什麼?其實,成功很難單一的歸納為靠什麼條件,如果一定要回答,只能從某種意義上說 很多人的成功就是靠他們每天比別人 多做一點點 正如古人有云 業精於勤,荒於嬉。這裡所說的勤,也就是比別人多做一點點,即付出多一點的勞動和努力。不要小看這一點點,又如古語說 集腋成裘,積沙成丘。如果...

每天進步一點點

在模組化程式設計時,在子模組中宣告變數 例如unsigned char aa 不需要在標頭檔案中宣告 要在主函式中呼叫,要寫成 extern unsigned char aa 而不能寫成 extern aa 寫成extern aa 則無法改變aa的值。2014年9月22日 21 12 00 品質因數...

每天進步一點點(一)

最近接了第乙個商業專案,一人獨立完成從前台到後台,做了有幾天的時間,每天進步一點點,把每天看到的學到的記錄下來,以後也堅持。後台繼續用自己的extjs老本行,因為相比其他js庫,extjs用的比較熟,現成的 也有所以開發起來也比較容易,今天學到了兩個ext的新東西。一 ext和後台進行互動大部分用的...