tianbushengyinuo的博客

在使用vue-quill-editor的时候，遇到前四个功能全失效的情况，即加粗、倾斜、下划线、删除线失效，其原因其实是全局css，我的reset.css是设置了strong（加粗）、em（倾斜）、u(下划线）、s（删除线）默认样式，导致失效，只要对全局css做修改即可。其他样式失效也可能是这个原因，可作为参考，如代码块没有背景色，在全局css对pre添加背景色即可。...

vue-quill-editor默认代码块没有高亮效果，如图：而没有高亮区别显示的代码是没有灵魂的，接下来呢，引入highlight.js使代码高亮，有关highlight.js，可浏览 highlight.js官网首先，依然是安装与引入1、安装npm install highlight.js 2、引入在需要的组件引入import hljs from 'highlight.js'在需要的组件引入或在main.js全局引入代码高亮样式，我选的是dracula.css，还有许多其他样式

第一步1、首先当然是安装vue-quill-editor包npm 安装 vue-quill-editornpm install vue-quill-editor --save2、常规操作，接下来向Vue项目里引入vue-quill-editor在main.js里引入vue-quill-editor和样式import VueQuillEditor from 'vue-quill-editor'import 'quill/dist/quill.core.css'import 'quill/di