编辑器菜单栏默认使用的是目前比较主流、简介的字体图标，如果因为特殊需求想自定义菜单的UI，完全可以。例如下图将『粗体』和『斜体』菜单，换成普通的按钮形式。  ---- 可通过`editor.UI.menus`配置每个菜单的UI，代码示例如下，注意代码中的注释： ```html <div id="div1"> <p>请输入内容...</p> </div> <!--这里引用jquery和wangEditor.js--> <script type="text/javascript"> var editor = new wangEditor('div1'); // bold 是菜单的id，所有菜单的id，可在自定义菜单的文档中找到 editor.UI.menus.bold = { // normal 配置正常状态下显示的UI normal: '<button style="font-size:20px; margin-top:5px;">B</button>', // selected 配置选中状态下的UI，.selected 说明菜单在选中状态下要增加一个 selected class selected: '.selected' }; editor.UI.menus.italic = { normal: '<button style="font-size:20px; margin-top:5px;">I</button>', // selected 配置选中状态下的UI，除了上文配置样式之外，还可以配置一个单独的标签节点 selected: '<button style="font-size:20px; margin-top:5px;"><i>I</i></button>' }; editor.create(); </script> ``` **『正常状态』和『选中状态』的说明：** - **正常状态**：例如，编辑区域的光标处于一段非链接状态的文字中时，『插入链接』菜单显示为 ，这就是正常状态 ； - **选中状态**：例如，编辑区域的光标处于一个链接中时，『插入链接』菜单显示为 ，这就是选中状态； 总结：『选中状态』即是光标所处的位置的文字格式，符合菜单操作之后的结果，而对菜单做出特殊标记。