将文本段落分割成多个列进行显示。

用法

将文本段落分割成多个列,只需要添加一个 .uk-column-1-* 类名即可生效。

Class Description
.uk-column-1-2 将文本段落分割成两列
.uk-column-1-3 将文本段落分割成三列
.uk-column-1-4 将文本段落分割成四列
.uk-column-1-5 将文本段落分割成五列
.uk-column-1-6 将文本段落分割成六列

Example

Markup

<p class="uk-column-1-3">...</p>

响应式布局中的列

列组件通用提供了只在特定视口宽度中生效的响应式类名

Class Description
.uk-column-* 所有设备宽度都生效
.uk-column-small-* 只在设备宽度 480px 以上时生效
.uk-column-medium-* 只在设备宽度 768px 以上时生效
.uk-column-large-* 只在设备宽度 960px 以上时生效
.uk-column-xlarge-* 只在设备宽度 1200px 以上时生效

Example

Markup

<p class="uk-column-xlarge-1-4 uk-column-large-1-3 uk-column-medium-1-2">...</p>
文章导航