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