display 屬性值定義元素在文檔中的顯示形式:block:塊元素,占據(jù)整行寬度,可包含內(nèi)聯(lián)元素。inline:內(nèi)聯(lián)元素,只能設(shè)置寬度,不能包含塊元素。inline-block:結(jié)合塊元素和內(nèi)聯(lián)元素特點(diǎn),可包含內(nèi)聯(lián)元素。none:隱藏元素,不再占據(jù)文檔空間。flex:可伸縮容器,可控制元素排列和大小。grid:網(wǎng)格布局,可創(chuàng)建多列多行的布局。table:表格元素,由表頭、表體和表腳組成。
CSS 中的 Display 屬性值
Display 屬性定義元素在文檔中的表現(xiàn)形式,決定元素如何顯示。它有以下主要值:
1. Block
塊元素,占據(jù)整行的寬度
可以設(shè)置高度和寬度
可以包含內(nèi)聯(lián)元素
2. Inline
內(nèi)聯(lián)元素,不占據(jù)整行
只能設(shè)置寬度,不能設(shè)置高度
不能包含塊元素
3. Inline-block
結(jié)合了塊元素和內(nèi)聯(lián)元素的特點(diǎn)
占據(jù)部分行的寬度
可以設(shè)置高度和寬度
可以包含內(nèi)聯(lián)元素
4. None
隱藏元素
元素不再占據(jù)文檔中的空間
5. Flex
可伸縮容器,用于在元素之間分配空間
可以控制元素的排列方式和大小
6. Grid
網(wǎng)格布局,用于創(chuàng)建多列多行的布局
可以控制元素的位置和大小
7. Table
表格元素,用于顯示數(shù)據(jù)
由表頭、表體和表腳組成
其他值:
run-in
list-item
table-cell
table-column-group
table-column
table-footer-group
table-header-group
table-row
table-row-group