quil l.js 介绍
quil l.js是一款强大的现代富文本编辑器 插件 。该富文本编辑器 插件 支持 所有的现代浏览器、平板电脑和手机。它提供了文本编辑器的所有 功能 ,并为开发者提供大量的配置参数和 方法 。?
quil l.js使用 方法
在 页面 中引入编辑器 主题 颜色 文件 quil l.s Now .css,以及 quil l.js 文件 。
<link href="http://cdn. quil ljs.com/1.0.0/ quil l.s Now .css" rel="stylesheet">
<script src="http://cdn. quil ljs.com/1.0.0/ quil l.js"></script>
下面是 quil l.js的 CDN加速 地址:
<!-- Main quil l library -->
<script src="//cdn. quil ljs.com/1.0.3/ quil l.js" type="text/JavaScript"></script>
<script src="//cdn. quil ljs.com/1.0.3/ quil l.min.js" type="text/JavaScript"></script>
<!-- Theme included stylesheets -->
<link href="//cdn. quil ljs.com/1.0.3/ quil l.s Now .css" rel="stylesheet">
<link href="//cdn. quil ljs.com/1.0.3/ quil l.bubble.css" rel="stylesheet">
<!-- Core build with no theme,formatting,non-essential modules -->
<link href="//cdn. quil ljs.com/1.0.3/ quil l.core.css" rel="stylesheet">
<script src="//cdn. quil ljs.com/1.0.3/ quil l.core.js" type="text/JavaScript"></script>
?html结构
使用下面的 代码 作为文本编辑器的html结构:
<!-- 创建工具栏组件 -->
<div id="toolbar">
<button class="ql-bold">Bold</button>
<button class="ql-italic">Italic</button>
</div>
<!-- 创建文本编辑器 -->
<div id="editor">
<p> Hello World! </p>
</div>
?初始化 插件
在 页面 DOM元素加载完毕之后,通过下面的 方法 来实例化 一个 编辑器对象。
var editor = new quil l('#editor',{
modules: { toolbar: '#toolbar' },
theme: 's Now '
});
?
网站地址 : https://quilljs.com/
GitHub: https://github.com/quilljs/quill
网站描述: 强大,丰富的文本编辑器
quill.js官方网站
官方网站: https://quilljs.com/
如果觉得 网站内容还不错,欢迎将 网站 推荐给程序员好友。