测验

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

主题
CSS

display 属性的常见值:none、block、inline、inline-block、flex、grid、table、table-row、table-cell、list-item。

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

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

参考资料

练习

检验你的理解
测试版
检验你的理解 练习 1/2
检验你的理解 练习 1/2

Which statements about display values are correct? Select all that apply.