1. 程式人生 > >深入了解display:inline-block

深入了解display:inline-block

所有 block 寬高 spl 一行 strong clas spa 不支持

先聊display吧,display 屬性規定元素應該生成的框的類型。也就是這個屬性用於定義建立布局時元素生成的顯示框類型。因為牽扯到布局,使用display屬性時,要是用錯了display的值,很可能之前的布局會大亂。針對前端構建布局工程師來說,布局亂了那還了得,所有很有必要深入了解display屬性。

display常用到的幾個屬性值block、inline-block、inline和none

屬性值 block inline inline-block none
寬高 支持寬高 不支持寬高 支持寬高 隱藏元素,並脫離文檔流
不設置寬度時,寬度為父元素寬度 內容撐開寬度 不設置寬度時,內容撐開寬度
獨占一行 非獨占一行 非獨占一行

深入了解display:inline-block