富文本编辑
在线富文本编辑器，支持格式化文字、插入图片、表格、代码块等，实时预览，一键导出 HTML，内容自动保存到本地，适合撰写文章、邮件、文档。
富文本编辑器
实时预览
功能特性
所见即所得编辑
基于 Quill 引擎，工具栏一键加粗、斜体、标题、列表、对齐，编辑过程实时呈现最终排版效果。
图片上传
点击图片按钮选择本地图片，自动上传至后端并插入正文；后端不可用时回退为本地 base64 内嵌，离线也可用。
实时预览
右侧预览区与编辑器内容逐字同步，完整渲染 Quill 样式，方便对照检查排版与图片显示效果。
导出 HTML
一键将正文导出为独立 HTML 文件，含基础样式与标题；后端不可用时本地生成完整 HTML 文档下载。
自动保存
每 10 秒自动将正文写入浏览器 localStorage，刷新或关闭页面后再次打开可恢复上次内容，无需手动存盘。
富文本格式
支持标题、字体、字号、颜色、背景色、上下标、有序无序列表、缩进、对齐、引用、代码块、链接与视频。
使用说明
编辑器使用
- 顶部工具栏分为标题/字体/字号、加粗/斜体/下划线/删除线、文字颜色/背景色、上下标、列表/缩进/对齐、引用/代码块、链接/图片/视频、清除格式等分组。
- 选中文字后点击对应按钮即可应用格式；点击「清除格式」按钮可一键还原为正文样式。
- 右侧预览区实时同步编辑器内容，所见即所得。
图片插入
- 点击工具栏「图片」按钮，选择本地图片文件（支持 jpg/png/gif/webp 等常见格式）。
- 图片优先上传至后端服务器返回地址后插入；若后端接口不可用，自动回退为本地
FileReader读取为 base64 内嵌到正文。 - 插入的图片会自适应正文宽度，可在编辑器中调整位置与说明文字。
导出文档
- 点击顶部「导出 HTML」按钮，将当前正文导出为独立的
.html文件。 - 导出请求会发送到后端生成带样式的完整 HTML；若后端不可用，则本地拼装包含基础样式的 HTML 文档并触发下载。
- 导出文件可直接用浏览器打开查看，或粘贴到邮件、博客系统中。
自动保存说明
- 编辑器每 10 秒 自动将正文写入浏览器本地存储（localStorage），键名
richtext-editor-content。 - 页面顶部会显示最近一次保存时间，方便确认内容已落盘。
- 刷新页面或关闭后再次打开，将自动恢复上次保存的内容。点击「清空内容」并确认后才会清除。
典型使用场景
- 撰写文章：在浏览器中直接排版长文，配合标题、列表、引用块组织结构，完成后导出 HTML 发布。
- 邮件草稿：编辑带格式的邮件正文，插入图片说明，导出后粘贴到邮件客户端发送。
- 文档片段：临时记录带格式的笔记与代码块，自动保存避免丢失，随时恢复继续编辑。
- 富文本 demo：快速生成带样式的 HTML 片段，用于测试页面渲染或演示排版效果。
常见问题
编辑器支持哪些文本格式？
支持 H1-H6 标题、字体、字号、加粗、斜体、下划线、删除线、文字颜色、背景色、上下标、有序/无序列表、缩进、左中右两端对齐、引用块、代码块、超链接、图片与视频嵌入，以及一键清除格式。覆盖日常文档排版所需的绝大多数格式。
插入的图片是如何处理的？
图片会优先通过后端接口上传，后端返回图片地址（base64 data URL）后插入正文。如果后端服务不可用（如网络错误或接口异常），编辑器会自动回退为本地
FileReader 读取图片为 base64 内嵌，确保离线环境下也能正常插入图片。base64 内嵌的图片会随文档一起保存与导出。
编辑内容是否会上传到服务器保存？
正文内容默认仅保存在浏览器本地（localStorage），不会主动上传到服务器持久化。仅在点击「导出 HTML」或插入图片时，相关数据会通过接口发送给后端处理（生成文件或转存图片），处理完成后即返回，不做长期存储。因此请勿在公用电脑上保存敏感内容。
导出的文件是什么格式？
导出为独立的
.html 文件，包含完整 HTML 结构与基础排版样式（字体、列表、引用、代码块、图片自适应等）。可直接用浏览器打开查看，也可用文本编辑器查看源码，或粘贴到支持 HTML 的平台（如博客、邮件）中使用。
这个富文本编辑器是免费的吗？
完全免费，无需注册登录即可使用全部功能。编辑、预览、自动保存均在浏览器本地完成，图片上传与导出 HTML 通过后端接口提供，均不收取任何费用，也没有使用次数限制。
能在手机上使用吗？
可以。编辑器采用响应式布局，在窄屏设备上编辑区与预览区会自动上下堆叠显示，工具栏可横向滚动。但由于移动端屏幕较小，工具栏按钮较多，推荐在平板或桌面浏览器上使用以获得更佳的排版体验。手机上自动保存与导出功能同样可用。