此组件允许您对齐和居中页面内容。
将 .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>