武林網(www.survivalescaperooms.com)文章簡介：用到的CSS屬性值：inline-block:將對象呈遞為內聯對象，但是對象的內容作為塊對象呈遞。旁邊的內聯對象會被呈遞在同一行內就這樣，完美的圖文居中顯示就做出來了。 是不是很驚奇？事實告訴我們，合理的利用CSS既可實現一些似乎不太可能的效果。

工作中經常會遇到一個圖文的效果，如圖：

再常見不過的效果了，對于下面的文字，一般我們的處理方式是居中，但文字多了會怎么辦呢？有人會回答“隱藏”；也有人會回答“換行”。
對于“換行”的處理方法我們會遇到一個問題，如果是文字居中，那第二行也會居中，這樣就會造成一種不友好的表現效果。

那么有沒有一種方法可以針對第一行的文字實現居中，第二行的文字實現居左顯示呢?

請看：

運行代碼框

[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運行]

CSS如下：

HTML如下：

用到的CSS屬性值：inline-block:將對象呈遞為內聯對象，但是對象的內容作為塊對象呈遞。旁邊的內聯對象會被呈遞在同一行內就這樣，完美的圖文居中顯示就做出來了。 是不是很驚奇？事實告訴我們，合理的利用CSS既可實現一些似乎不太可能的效果。