啊,inline-block,挺難琢磨并且迷人的聲明上承諾了很多,其實(shí)提供了很少。很多次我拿到類似這樣的 PSD 文件:
就哭了。
一般說來,這種類型的布局是小菜一樁。固定寬度,固定高度,向左浮動(dòng)就解決了。但是,這個(gè)設(shè)計(jì)中內(nèi)容的多少是可變的,這就意味著如果這些塊中的一些內(nèi)容比其他的多,就會(huì)破壞這個(gè)布局。
因?yàn)榈谝粋€(gè)展示項(xiàng)比其他項(xiàng)高,第五個(gè)項(xiàng)目就相對第一個(gè)浮動(dòng),而不是位于它下面了。基本上我們想要一個(gè)彈性表格的布局,但是適當(dāng)?shù)模Z義標(biāo)記。
我們以一個(gè)無序列表開始這個(gè)簡單的頁面,并把 display 設(shè)置為 inline-block:
新聞熱點(diǎn)
疑難解答
圖片精選