text

说明：

• 该组件从API version 4开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。

• 文本的展示内容需要写在元素标签内。

文本，用于呈现一段信息。

权限列表

无

子组件

支持<span>。

属性

支持通用属性。

样式

除支持通用样式外，还支持如下样式：

说明：

• 字体动态缩放：预设尺寸集合和最小最大字号调节基于是否满足最大行数要求，预设尺寸集合会按照从左到右顺序查看是否满足最大行数要求，最小最大字号调节则基于从大到小顺序查看是否满足最大行数要求。

• 文本换行：文本可以通过转义字符\r\n进行换行。

• 文本标签内支持以下转义字符：\a，\b，\f，\n，\r，\t，\v，'，"，\0。

• 当使用子组件span组成文本段落时，如果span属性样式异常，将导致text段落无法显示。

• letter-spacing、text-align、line-height、text-overflow和max-lines样式作用于text及其子组件（span）组成的文本内容。

• text组件说明：不支持text内同时存在文本内容和span子组件。（如果同时存在，只显示span内的内容)

事件

支持通用事件。

方法

支持通用方法。

示例​

<!-- xxx.hml -->
<div class="container">
    <text class="title">default text</text>
    <text class="title textcolor">hello world with color</text>
    <text class="title textsize">hello world with font-size</text>
    <text class="title textletterspacing">hello world with letter-spacing</text>
    <text class="title textwordspacing">hello world with word-spacing</text>
    <text class="title textstyle">hello world with italic</text>
    <text class="title textweight">hello world with font-weight</text>
    <text class="title textdecoration1">hello world with underline</text>
    <text class="title textdecoration2">hello world with line-through</text>
    <text class="title textalign">hello world with text-align:right</text>
</div>

/* xxx.css */
.container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.title {
    text-align: center;
    width: 800px;
    height: 60px;
}
.textcolor {
    color: indianred;
}
.textsize {
    font-size: 40px;
}
.textletterspacing {
    letter-spacing: -3px;
}
.textwordspacing {
    word-spacing: 20px;
}
.textstyle {
    font-style: italic;
}
.textweight {
    font-weight: 700;
}
.textdecoration1 {
    text-decoration: underline;
}
.textdecoration2 {
    text-decoration: line-through;
    text-decoration-color: red;
}
.textalign {
    text-align: right;
}