大小扩展

展示文本 ui.text - 图1

  1. <span class="u-text u-text-xs">超小号文本</span>
    <span class="u-text u-text-sm">小号文本</span>
    <span>正常文本</span>
    <span class="u-text u-text-lg">大号文本</span>
    <span class="u-text u-text-xl">超大号文本</span>

颜色扩展

展示文本 ui.text - 图2

  1. <span>Default</span>
    <span class="u-text u-text-primary">Primary</span>
    <span class="u-text u-text-success">Success</span>
    <span class="u-text u-text-warning">Warning</span>
    <span class="u-text u-text-error">Error</span>
    <span class="u-text u-text-inverse">Inverse</span>
    <span class="u-text u-text-muted">Muted</span>

加粗

展示文本 ui.text - 图3

  1. <div class="f-fwb">加粗文本</div>

文本对齐

展示文本 ui.text - 图4

  1. <div class="f-tal">左对齐</div>
    <div class="f-tac">居中对齐</div>
    <div class="f-tar">右对齐</div>
    <div class="f-taj">两端对齐</div>

垂直对齐

展示文本 ui.text - 图5

  1. <div class="f-vat">顶部对齐</div>
    <div class="f-vam">垂直居中</div>
    <div class="f-vab">底部对齐</div>

待完成……

文本省略和换行

展示文本 ui.text - 图6

  1. <div class="f-toe" style="width:100px;">这是一段很长很长的文字</div>

待完成……

API

Input

Kind: global classExtend: Component

new Input()

ParamTypeDefaultDescription
[options.data]object= 绑定属性
[options.data.text]string"文本"<=> 内容
[options.data.size]string=> 大小
[options.data.isBold]booleanfalse=> 是否加粗
[options.data.align]string=> 左右对齐方式
[options.data.vertical]string=> 上下对齐方式
[options.data.type]string"default"=> 文本样式