UIkit3.x文档

标题

为标题定义各种样式。

将这个组件与Text 组件 结合使用以设置标题样式。

尺寸

添加以下class之一以修改标题的大小和样式。这些class通常用于标题元素，但它们也可与其他任何元素（例如div元素）一起使用。请注意，这些类将标题类从Base组件Base 组件 向上扩展，并且最小的修饰符将在h1 元素之后选择大小。

Class Description
.uk-heading-small 小号标题
.uk-heading-medium 中等标题
.uk-heading-large 大号标题
.uk-heading-xlarge 加大号标题
.uk-heading-2xlarge 加加大号标题 
<h1 class="uk-heading-medium"></h1>

  • Small

    Medium

    Large

    X-Large

    2X-Large

  • <h1 class="uk-heading-small">Small</h1>
<h1 class="uk-heading-medium">Medium</h1>
<h1 class="uk-heading-large">Large</h1>
<h1 class="uk-heading-xlarge">X-Large</h1>
<h1 class="uk-heading-2xlarge">2X-Large</h1>

分隔线

使用.uk-heading-divider为标题添加分隔线。您可以将其与任何尺寸修饰类结合使用。

<h1 class="uk-heading-divider"></h1>

  • Heading Divider

  • <h1 class="uk-heading-divider">Heading Divider</h1>

项目修饰

若要对标题应用项目符号，请添加.uk-heading-bullet类。您可以将它与任何大小修饰符组合使用，并且该修饰可以与文本对齐。

<h1 class="uk-heading-bullet"></h1>

  • Heading Bullet

  • <h1 class="uk-heading-bullet">Heading Bullet</h1>

标题线条

要在标题上添加线条效果，并且线条垂直居中，请添加.uk-heading-line类，并将<span>放置在标题元素中。您可以将它与任何大小修饰符组合，并且它可以很好地与文本对齐方式配合使用。

<h1 class="uk-heading-line"><span></span></h1>

  • Heading Line

    Heading Line

    Heading Line

  • <h1 class="uk-heading-line"><span>Heading Line</span></h1>

<h1 class="uk-heading-line uk-text-center"><span>Heading Line</span></h1>

<h1 class="uk-heading-line uk-text-right"><span>Heading Line</span></h1>