容器

的容器元素是一个完美的伴侣部分元素。当我们放置一个容器在一个部分，我们将元素放入容器- - -容器保持内容整齐地排列在屏幕中央。

在这节课中:

1. 集装箱解剖
2. 添加一个容器
3. Custom-width容器
4. 集装箱填充
5. 重用容器
6. 容器和Div块
   

集装箱解剖

一个容器是一个Div块与预定义的样式。它有一个940像素的最大宽度，更大的显示器，保持你的内容相对于浏览器窗口居中。在小型设备(如手机和平板电脑)上，容器扩展到整个屏幕的宽度。

添加一个容器

你可以添加容器在元素面板(A)的布局部分。

然后，可以放置新元素或将内容移动到容器．

Custom-width容器

默认情况下,容器元素自动响应。但有时您需要一个更宽的容器，而不是默认的最大宽度(940像素)。

你可以分两步完成

1. 向我们的容器(如容器)
2. 设置最大宽度(例如1100像素)。

现在,容器将响应您的视口的大小，但只扩展到您设置的最大宽度。

更大的断点

也可以设置样式容器对于大于默认值的断点。如果你想要容器宽度为更大的显示更合适的大小-你可以通过4步完成:

1. 单击添加大断点选项(基本断点旁边的三个点)
2. 选择任何较大的断点
3. 然后，确保选择您的容器元素
4. 最后，更改最适合所选断点的最大宽度样式

注意:总是返回基本断点来继续设计项目。原因是这样的:在风格的面板从基座向外层叠。

更改向下级联到更小的断点。

从基本断点向上到更大的断点。

集装箱填充

你可以使用你的容器在元素周围增加空间。在我们的示例中，内容被推到移动视图断点的边缘。

这是因为容器是全宽的移动设备和元素在边缘。你可以调整衬垫，给一些舒适的呼吸空间。

要做到这一点:

1. 选择画布上的Container元素(在我们的示例中，我们将其命名为“Container”)
2. 在样式面板中，添加左右边距(例如20像素)

这种样式将传递到移动肖像以及。

重用容器

因为你已经给了容器一个类(在我们的示例中，我们将其命名为“Container”)，您可以将该类应用于添加到项目中的其他容器。

应用一个类:

1. 在画布上选择一个元素
2. 中键入类名选择器场
3. 新闻返回

请注意:对该类样式的更改将影响应用该类的所有容器。了解更多关于类．

容器和Div块

section中的容器是web开发中常见的层次结构

一个部分，默认为全宽。在部分，你有一个容器这使得里面的所有东西都整齐地朝向中心。

Div块是设计项目时使用的最基本和最通用的元素，因为它可以是您想要的任何东西。你可以在容器内使用Div块来组织你的元素布局，间距，大小,位置风格。

请注意:一个部分是一个Div块这是全宽a容器是一个Div块默认有一个最大宽度。

但这只是Webflow设计器中容器的概述。