在設(shè)置display:flex,justify-content: space-betweend的時(shí)候,它會(huì)把子元素靠邊對(duì)齊平均分剩余的空間。
例如:打算一行放三個(gè)子元素

效果:

這看起來(lái)一點(diǎn)問(wèn)題都沒(méi)有,還挺好看的,但是如果下一行不夠三個(gè)呢,只有兩個(gè)的時(shí)候就會(huì)出現(xiàn)問(wèn)題。

這樣看起來(lái)特別惡心,中間空了一大塊出來(lái),看起來(lái)特別像一個(gè)bug,而不是我們要的跟上一行一個(gè)一個(gè)對(duì)齊的效果。
現(xiàn)在來(lái)解決這個(gè)問(wèn)題,在這里提供兩個(gè)方法:
偽類(lèi):after
提供占位元素
偽類(lèi)方案

占位元素方案

效果

新聞熱點(diǎn)
疑難解答