美文网首页
rich里自定义富文本样式

rich里自定义富文本样式

作者: 小睿同学 | 来源:发表于2019-08-20 14:04 被阅读0次

在 rich 里面,可以自定义富文本样式。利用富文本样式,可以在标签中做出非常丰富的效果。

例如:

label: {
    // 在文本中,可以对部分文本采用 rich 中定义样式。
    // 这里需要在文本中使用标记符号:
    // `{styleName|text content text content}` 标记样式名。
    // 注意,换行仍是使用 '\n'。
    formatter: [
        '{a|这段文本采用样式a}',
        '{b|这段文本采用样式b}这段用默认样式{x|这段用样式x}'
    ].join('\n'),

    rich: {
        a: {
            color: 'red',
            lineHeight: 10
        },
        b: {
            backgroundColor: {
                image: 'xxx/xxx.jpg'
            },
            height: 40
        },
        x: {
            fontSize: 18,
            fontFamily: 'Microsoft YaHei',
            borderColor: '#449933',
            borderRadius: 4
        },
       ...
    }
}

rich 中如果没有设置 lineHeight,则会取父层级的 lineHeight

相关文章

网友评论

      本文标题:rich里自定义富文本样式

      本文链接:https://www.haomeiwen.com/subject/nchpsctx.html