跳至主要内容

文档

容器

此组件允许您对齐和居中页面内容。

用法

.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>

部分中的容器

您可以应用此组件来修改 部分组件 中内容的宽度。

<div class="uk-section uk-section-primary">
    <div class="uk-container uk-container-small"></div>
</div>