同时兼容了Web端和移动端的富文本编辑器,样式也非常美好,比较推荐。

浏览器兼容性

Android 9.0 * 10.0 * Firefox 73 u 74 8.1 74 10 74 u Chrome 79 8.1 79 u 80 10 80 u iPhone 12 u 13 u Edge 79 10 80 10 Safari 12 u 13 u TESTING POWERED BY

Jason ChenByron Milligan创建,并由Slab积极维护。

部署方法

<!-- 加载Quill.js样式 -->
<link href="https://cdn.quilljs.com/1.0.0/quill.snow.css" rel="stylesheet" />

<!-- Quill.js富文本工具栏 -->
<div id="toolbar">
  <button class="ql-bold">Bold</button>
  <button class="ql-italic">Italic</button>
</div>

<!-- Quill.js富文本 -->
<div id="editor">
  <p>Hello World!</p>
</div>

<!-- 加载Quill.js -->
<script src="https://cdn.quilljs.com/1.0.0/quill.js"></script>

<script>
  // 实例化
  var editor = new Quill('#editor', {
    modules: { toolbar: '#toolbar' },
    theme: 'snow',
  });
</script>

NPM 部署

npm install quill

相关链接

Github地址:https://github.com/quilljs/quill/
官方网站:https://quilljs.com/
官方文档:https://quilljs.com/docs/quickstart/
看云中文文档:http://doc.quilljs.cn/1409423/

相关CDN

<!-- Main Quill library -->
<script src="//cdn.quilljs.com/1.0.0/quill.js"></script>
<script src="//cdn.quilljs.com/1.0.0/quill.min.js"></script>

<!-- Theme included stylesheets -->
<link href="//cdn.quilljs.com/1.0.0/quill.snow.css" rel="stylesheet" />
<link href="//cdn.quilljs.com/1.0.0/quill.bubble.css" rel="stylesheet" />

<!-- Core build with no theme, formatting, non-essential modules -->
<link href="//cdn.quilljs.com/1.0.0/quill.core.css" rel="stylesheet" />
<script src="//cdn.quilljs.com/1.0.0/quill.core.js"></script>

阿里云盘下载地址

「Quill.js」https://www.aliyundrive.com/s/iEa3xWT6cJK