Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
OpenHarmony
Docs
提交
6c42e37e
D
Docs
项目概览
OpenHarmony
/
Docs
1 年多 前同步成功
通知
159
Star
292
Fork
28
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
D
Docs
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
提交
6c42e37e
编写于
2月 23, 2022
作者:
Y
yaoyuchi
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
change illustration from richtext docs
Signed-off-by:
N
yaoyuchi
<
yaoyuchi@huawei.com
>
上级
74664e47
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
20 addition
and
16 deletion
+20
-16
zh-cn/application-dev/reference/arkui-js/js-components-basic-richtext.md
...on-dev/reference/arkui-js/js-components-basic-richtext.md
+20
-16
未找到文件。
zh-cn/application-dev/reference/arkui-js/js-components-basic-richtext.md
浏览文件 @
6c42e37e
# richtext<a name="ZH-CN_TOPIC_0000001173164701"></a>
富文本组件,用于展示富文本信息
。
>![](../../public_sys-resources/icon-note.gif) **说明:** 该组件从API Version 8开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本
。
>![](../../public_sys-resources/icon-note.gif) **说明:**
>- 富文本内容需要写在元素标签内。
富文本组件,用于展示富文本信息,内容需要写在元素标签内。
## 权限列表<a name="section11257113618419"></a>
无
## 子组件<a name="section877361219116"></a>
不包含子组件。
## 属性<a name="section2907183951110"></a>
仅支持
[
通用属性
](
js-components-common-attributes.md
)
中的id、style和class属性。
...
...
@@ -53,10 +56,6 @@
>- richtext内容不建议超过一个屏幕高度,超出部分不会显示。
>- 不支持设置宽度,默认撑开全屏。
## 方法<a name="section14703165113610"></a>
不支持。
## 示例<a name="section581819591666"></a>
```
...
...
@@ -71,20 +70,25 @@
export default {
data: {
content: `
<div class="flex-direction: column; background-color: #ffffff; padding: 30px; margin-bottom: 30px;" style="background-color: #FFFFFF">
<style>h1{color: yellow;}</style>
<p class="item-title">h1</p>
<h1>文本测试(h1测试)</h1>
<p class="item-title">h2</p>
<h2>文本测试(h2测试)</h2>
</div>
<h1 style='text-align: center;'>h1标题</h1>
<h1 style='text-align: center;'><i>h1斜体</i></h1>
<h1 style='text-align: center;'><u>h1下划线</u></h1>
<h2 style='text-align: center;'>h2标题</h2>
<h3 style='text-align: center;'>h3标题</h3>
<p style='text-align: center;'>p常规</p><hr/>
<div style='width: 500px;height: 500px;border: 1px solid;margin: 0auto;'>
<p style='font-size: 35px;text-align: center;font-weight: bold; color: rgb(24,78,228)'>字体大小35px,行高45px</p>
<p style='background-color: #e5e5e5;line-height: 45px;font-size: 35px;text-indent: 2em;'>
这是一段文字这是一段文字这是一段文字这是一段文字这是一段文字这是一段文字这是一段文字这是一段文字
这是一段文字</p>
</div>
`,
},
onLoadStart() {
console.error("start load rich text
:" + JSON.stringify()
)
console.error("start load rich text
."
)
},
onLoadEnd() {
console.error("end load rich text
:" + JSON.stringify()
)
console.error("end load rich text
."
)
}
}
```
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录