下载下来后解压到web静态文件目录下 html中引入相关css与js ~~~ <!-- 字体图标样式表 --> <link href="http://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> <!-- 编辑器样式表 --> <link rel="stylesheet" type="text/css" href="static/wysiwyg-editor/css/froala_editor.pkgd.min.css"/> <!-- 编辑器脚本 --> <script src="static/wysiwyg-editor/js/froala_editor.pkgd.min.js"></script> ~~~ 以上三条是必须引入的否则会出现问题. 初始化编辑器 ~~~ <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Hello</title> <link href="http://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> <link rel="stylesheet" type="text/css" href="static/wysiwyg-editor/css/froala_editor.pkgd.min.css"/> <!--[if lt IE 9]> <script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script> <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script> <![endif]--> </head> <body> <textarea id="edit" name="content" style="width: 100%;"></textarea> <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script> <script src="static/wysiwyg-editor/js/froala_editor.pkgd.min.js"></script> <script> $("#edit").froalaEditor(); </script> </body> </html> ~~~ ![](https://box.kancloud.cn/134a0a19eea2ab7f0b566db47441fa8a_1067x393.png)