块/Block

通过将内容片段打包成拥有不同样式的块来分割内容。

用法

只需要为容器元素添加 .uk-block 类，就能使用这个组件了。

Example

Markup

<div class="uk-block">...</div>

修饰

使用不同的背景颜色和 padding ，添加以下类中的一个就行了。当两个连续的块拥有相同的背景色时，padding 会自动被分开。

Class 描述
.uk-block-default 添加默认的背景色彩，通常是白色或类似的颜色。
.uk-block-muted 添加亮背景色。
.uk-block-primary 添加表示着重的背景色。
.uk-block-secondary 添加另一种背景色，通常是暗色。

注意 为了在有色的块中恰到好处地显示色彩、border和其他元素，你可能需要使用对比度组件中的 .uk-contrast 类。

Example

Markup

<div class="uk-block uk-block-primary">...</div>

Padding

为块添加较大的 padding ，只需添加一个 .uk-block-large 类。你还可以使用效果组件中的 .uk-padding-* 类，来设置块中 padding 。

Example

Markup

<div class="uk-block uk-block-large">...</div>