该组件用于对齐和居中页面内容。
为块级元素添加 .uk-container 类,使其具有最大宽度,并用来包裹网站的主体内容。该元素会居中显示,两侧带有内边距,在较大屏幕上会自动适配。
注意 嵌套容器的内边距会被移除,以避免多余的间隔。
<div class="uk-container"></div>为容器添加以下任意一个类,即可应用不同的最大宽度。
| 类 | 描述 |
|---|---|
.uk-container-xsmall |
添加该类以获得超小尺寸容器。 |
.uk-container-small |
添加该类以获得小尺寸容器。 |
.uk-container-large |
添加该类以获得大尺寸容器。 |
.uk-container-xlarge |
添加该类以获得超大尺寸容器。 |
.uk-container-expand |
如果你不想限制容器宽度,但仍希望保留动态的水平内边距,请添加该类。 |
<div class="uk-container uk-container-xsmall"></div>
<div class="uk-container uk-container-small"></div>
<div class="uk-container uk-container-large"></div>
<div class="uk-container uk-container-xlarge"></div>
<div class="uk-container uk-container-expand"></div>你可以使用该组件来调整来自 Section 组件 的区块内内容的宽度。
<div class="uk-section uk-section-primary">
<div class="uk-container uk-container-small"></div>
</div>