display屬性用于設置元素的顯示方式。
常用的display屬性值及其作用如下:
none:元素不顯示,其在頁面中占據的空間也會被移除。
block:將元素顯示為塊級元素,即占據一行的整個寬度,默認情況下每個塊級元素都會另起一行。
inline:將元素顯示為內聯元素,即在同一行顯示,不會另起一行。
inline-block:將元素顯示為行內塊元素,即在同一行顯示,同時可設置寬高等屬性。
flex:將元素顯示為彈性盒模型,通過設置彈性容器的屬性,可以實現彈性布局。
grid:將元素顯示為網格布局,通過設置網格容器的屬性,可以實現網格布局。
table:將元素顯示為表格布局,可以使用表格相關的屬性來布局。
inline-table:將元素顯示為內聯表格布局。
table-cell:將元素顯示為表格單元格布局。
table-row:將元素顯示為表格行布局。
此外,display屬性還可以與其他屬性一起使用,如display: flex;與flex-direction: row;配合使用可以實現水平排列的彈性盒子布局。