🔹display
╱🚧 under construction -> flow/writing direction
預設佔據所有寬度 (
width = 100%)。但可設定
width,height。書寫方式預設為
writing-mode: horizontal-tb,水平方式、由上到下排版。 (tb代表 top to bottom),跟隨 flow direction 流動。元素前後各會插入一個跳行 (line break)。
width,height由它的內容 (content) 決定,不可設定。可以設定水平方向的
margin,padding。無法設定垂直方向的
margin-top,margin-bottom。跟隨 writing direction 流動。
排版方式像
inline元素(由左至右、由上到下)。但像
block元素可設定width,height。內建
inline-block元素:img,button,select,input,textarea。
grid:將元素變成一個容器 (container),本身行為像
block元素,但改變子元素的行為。
flex:將元素變成一個容器 (container),本身行為像
block元素,但改變子元素的行為。display: flex:子元素朝水平方向排版 (flow direction 從 vertical 變為 horizontal)
none:將元素從畫面上移除,彷彿沒這個元素一樣。
An element that is floated is automatically display: block.

blockelements are like paragraphs, andinlineelements are like words.
Every Layout (2021)
Last updated
Was this helpful?