测验

什么是 CSS `display` 属性?你能举几个例子说明它的用法吗?

主题
CSS
在GitHub上编辑

display 属性的常见值:noneblockinlineinline-blockflexgridtabletable-rowtable-celllist-item

display描述
none不显示元素(该元素不再影响文档的布局)。所有子元素也都不再显示。文档的呈现就像该元素不存在于文档树中一样。
block元素在块方向上占用整行(通常是水平方向)。
inline元素可以并排排列。
inline-block类似于 inline,但允许一些 block 属性,如设置 widthheight
flex表现为块级 flex 容器,可以使用 flexbox 模型进行操作。
grid使用网格布局表现为块级 grid 容器。
table表现得像 <table> 元素。
table-row表现得像 <tr> 元素。
table-cell表现得像 <td> 元素。
list-item表现得像 <li> 元素,允许它定义 list-style-typelist-style-position

有关 display 属性的完整值列表,请参阅 CSS Display | MDN

参考资料

在GitHub上编辑