概述
问题描述
想做一个用vue.js + element-ui的个人网站，但是在引入富文本编辑器的时候出现了编辑器很长，占据了页面的整个宽度，而且很窄，会显示滚动条。本人最近才开始研究前端和ui的东西，却感觉不好解决，所以想问问大神们，这个因该如何解决。麻烦了
问题出现的环境背景及自己尝试过哪些方法
我是根据网上别人整合vue-quill-editor的方法引入的，css也引入了，但是就是和官网的版本不一样，toolbar都差行了。我试过手动改css样式，可以拉长编辑框的高度，但是toolbar的显示位置还是不正确。关键是工具栏的图标什么的显示在中间，但是按钮什么的还是要在原来的toolbar才能按到，也就是说是把鼠标移到toolbar栏的位置，会有隐形的按钮。更奇怪的室用F12都定位不到能看到的工具的图标的内容。。。
相关代码
// 请把代码文本粘贴到下方(请勿用图片代替代码)
代码就是和网上方法一样的代码
然后要引入自己添加的css才会显示变窄和变高，可是为什么官网的都不需要就默认是最标准的呢？
class="avatar-uploader"
:action="serverUrl"
name="img"
:headers="header"
:show-file-list="false"
:on-success="uploadSuccess"
:on-error="uploadError"
:before-upload="beforeUpload">
v-model="content"
:config="editorOption"
@blur="onEditorBlur($event)"
@focus="onEditorFocus($event)"
@ready="onEditorReady($event)">
.quill-editor {
width: 50%;
height: 700px;
}
你期待的结果是什么？实际看到的错误信息又是什么？
就是想要在不需要自己手动添加css样式的情况下显示成普通的默认效果。
不知道是不是和我设置的elementui什么的有关系，但是这个toolbar显示成这样也不应该啊！
如果有人也碰到过这样的问题，麻烦告诉我一下，非常感谢大家了！！
最后
以上就是怕孤独冰棍为你收集整理的editor修改样式 vue_vue.js+element-ui用vue-quill-editor时富文本编辑器样式显示问题的全部内容，希望文章能够帮你解决editor修改样式 vue_vue.js+element-ui用vue-quill-editor时富文本编辑器样式显示问题所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复