受团队信任
调整显示属性以确定元素的基本布局行为。
位于Style面板中的显示设置控制元素的布局行为以及元素周围的内容。在这里，您可以控制元素如何相互关联地显示—它们是堆叠在另一个元素上还是并排放置。
在本文中，我们将介绍Style面板中的每个显示设置:
块是大多数元素的默认显示设置。除非设置了自定义宽度，否则每个块元素都从新的一行开始，并占据其父元素的全部宽度。
无论其宽度如何，每个块元素都会将下一个元素推入新行。要并排放置元素，请选择不同的布局设置，例如内联块。
具有伸缩布局的元素将其直接子元素水平或垂直排列。
您可以自定义直接子元素如何堆叠、何时换行、如何在flex容器中对齐和对齐。
当您创建一个伸缩容器时，该父元素的所有直接子元素都成为伸缩子元素。您可以在伸缩子设置中添加和覆盖伸缩子的布局。
具有网格布局的元素将其直接子元素跨多个列和行排列。
您可以自定义如何在网格组件(容器、单个单元格、单元格组或轨迹)中定位、对齐和分布直接子元素。
使用网格布局，您可以指定列和行之间的间隙，称为轨迹。您还可以使用FR单元创建完全流体网格布局。
当选择网格容器的子容器时，网格子设置将出现在样式面板的顶部。这允许您覆盖网格容器设置以对齐和调整。
了解更多关于网格．
Flexbox和grid都是很棒的布局选择。Flexbox为您提供一维的布局控制—垂直或水平。Grid为你提供了二维布局控件，这对于杂志布局来说非常好。
关于每个布局选项的更多细节，它们之间的区别，以及当你想要使用一个而不是另一个的时候，查看我们的视频课程flexbox和网格．
内联块元素并排堆叠，它们的宽度由内部内容决定。
当内容到达父元素的边界时，内联块元素也将换行。在样式面板中，可以对内联块元素应用特定的宽度、高度、填充和空白设置。
内联是元素内任何文本内容的默认显示设置。可以通过更改内联元素的边距和填充来更改其布局，但不能更改其宽度或高度。
要完全隐藏一个元素，请将其显示设置设置为none。
设置为不显示的元素将不会由浏览器呈现，这可以方便地改变内容在移动设备上的显示方式。
