display

參考資料:(http://zh-tw.learnlayout.com/display.html)

block

像是div, p, form 都是標準的區塊元素。 一個區塊元素從新的一行開始顯示,並盡可能地撐滿容器。

inline

span 是一個標準的行內元素。 可以利用 span 包裹一些文字片段,利用css 去增添樣式,而不會影響版面配置。 像是 a 就是很常見的一種。

none

這也是一種很常用的 display 值,通常會搭配 JavaScript 去使用,用來隱藏或顯示該元素。

要注意 displayvisibility 屬性不一樣,把 display 設定成 None 不會保留元素原本的顯示空間,但是 visibility:hidden 雖然看不到,但還是會保留原本的顯示空間。

其他

list-item

table

這些請去看參考資料內所提供的詳細列表吧 ~ ^^

補充說明

每個元素都有預設的 display 屬性,雖然說把 div 修改成行內元素好像滿怪的XD

比較常見的方式,是把 li 修改成行內元素,使其可以呈現在水平的同一行上。

Last updated