前端 页面渲染标签数据

背景：

         使用 vue-quill-editor 富文本插件编辑文本，进行预览时无法按着编辑的文本样式 显示

 解决：

1、CSS代码：（主要是对富文本中编辑base64结果 的 标签设置样式 ） 

.html-box >>> img{
    max-width: 100%;
    height: auto !important;
}
.html-box >>> p{
    max-width: 100%;
    word-break: break-all;
    font-size: 15px;
}
.html-box >>> span{
    max-width: 100%;
    word-break: break-all;
    font-size: 15px;
}
.html-box >>> table{
    max-width: 100%;
}

2、HTML代码：（主要是通过 html标签 解析 字符串内容，引用 富文本的 ql-editor 样式）

<el-dialog :visible.sync="showHdxqDialog" width="375px">
   <!--引用富文本的自有样式 ql-editor 解决了，预览时样式问题 html-box -->
   <div class="html-box ql-editor" v-html="ylhdxq"></div>
</el-dialog>