说明：接下来介绍一个很棒的富文本编辑器wysiwyg。 首先，让我们来看看关于这个编辑器的官方功能说明。
接下来介绍一个很棒的富文本编辑器wysiwyg。 首先，让我们来看看关于这个编辑器的官方功能说明。
1、在Mac和Wndows平台上，可以针对常用操作自动绑定标准热键
2、支持上传可以通过拖动插入图像的图像(也可以获取移动设备的照片) )。
3、语音识别输入(仅限Chrome浏览器)
4、允许自定义工具栏； 不生成附加标签； 支持站点充分利用工具库(如Bootstrap和Font Awesome )的优秀特性
5、凡是没有强制规定的样式都由你决定
6、根据浏览器的标准特性，没有非标准代码的工具栏和键盘功能可以自定义，可以执行浏览器支持的命令
7、不需要自己制作框架，也不需要备份文本区域。 尽可能简化此编辑器，只在一个DIV中运行
8、(可选)清除结尾空格； 清除空的div和span
9、必须在现代浏览器中运行(通过Chrome 26、Firefox 19、Safari 6测试，报告用户在IE10上运行) )。
10、支持移动资源管理器(通过IOS 6 Ipad/Iphone和Android 4.1.1 Chrome测试) ) ) )。
注意： wysiwyg和wysihtml5是两个不同的编辑器。 wysiwyg是针对wysihtml5的强化版，比较相似。 所以大家可以根据自己的需要来使用。
wysiwyg官网： http://mind MUP.github.io/bootstrap-WYSIWYG /
wysiwyg中文网站： http://www.boot CSS.com/p/bootstrap-WYSIWYG /
wysihtml5官网： http://jhollingworth.github.io/bootstrap-wys ihtml5/
因为wysiwyg是wysihtml5的强化版，所以对wysiwyg的使用方法进行说明。 wysihtml5很相似。
使用步骤
1、导入以下js和css文件。 官方网站上介绍了大致的使用情况，但是以下文件必须导入才能生效。 因此，本网站注重实际运用，这些细节不容忽视。
2、输入js代码。 因为代码太多，所以这里不列出。 本站整理了源代码。 请参阅demo.html的源代码
.
3、在body标签中输入以下格式的html代码。 需要注意的是，此编辑器并未封装，而是直接将代码写入html页面。 整个编辑器可以分为两部分：顶部工具栏和文本编辑框。
1 )顶部工具栏：是div.btn-toolbar，包括多个div.btn-group。 每个工具按钮都是div.btn-group。 在每个div.btn-group中，您可以自行设置提示文本以显示中文。
.
这里还有html5语音输入工具。 代码如下。
2 )内容文本框： div#editor
内容
VS中demo.html结构的显示如下所示
alt=''/