我们经常可以看到各个博客网站中用于编辑文章的富文本编辑器,在富文本编辑器中,我们可以对我们的编辑内容样式进行设置。富文本编辑器一般是通过插件来实现的,我们只需要在页面中配置一下插件提供的一些API即可。
本例中使用Editormd来演示如何配置使用富文本编辑器。
Editormd简介
Editormd是国内开源的一款在线Markdown编辑器,可嵌入的 Markdown 在线编辑器(组件),基于 CodeMirror、jQuery 和 Marked 构建。
主要特性
支持“标准”Markdown / CommonMark和Github风格的语法,也可变身为代码编辑器。
- 支持实时预览、图片(跨域)上传、预格式文本/代码/表格插入、代码折叠、搜索替换、只读模式、自定义样式主题和多语言语法高亮等功能。
- 支持ToC(Table of Contents)、Emoji表情、Task lists、@链接等Markdown扩展语法。
- 支持TeX科学公式(基于KaTeX)、流程图 Flowchart 和 时序图 Sequence Diagram。
- 支持识别和解析HTML标签,并且支持自定义过滤标签解析,具有可靠的安全性和几乎无限的扩展性。
- 支持 AMD / CMD 模块化加载(支持 Require.js & Sea.js),并且支持自定义扩展插件。
- 兼容主流的浏览器(IE8+)和Zepto.js,且支持iPad等平板设备。
- 支持自定义主题样式。
官网地址:https://pandao.github.io/editor.md/
![9b1500a0f41ba49361b0df32ae295c1f.png](https://i-blog.csdnimg.cn/blog_migrate/eb63d53b2c56c989a2efa94b3ab3932a.jpeg)
创建文章表
在使用富文本编辑器之前,先来创建一个文章表article,这里只添加了最基本的几个字段, 以后想