Bootstrap与UEditor中Css冲突问题怎么解决

这篇“Bootstrap与UEditor中Css冲突问题怎么解决”文章的知识点大部分人都不太理解，所以小编给大家总结了以下内容，内容详细，步骤清晰，具有一定的借鉴价值，希望大家阅读完这篇文章能有所收获，下面我们一起来看看这篇“Bootstrap与UEditor中Css冲突问题怎么解决”文章吧。

UEditor组件是百度提供的一套开源的web在线所见即所得富文本编辑器，具有轻量，可定制，注重用户体验等特点，基于MIT协议，功能很强大。最近在使用的过程中发现其中上传的图片（或者插入已有的表情包图片）都无法正常缩放，选中图片，用鼠标点击并拖动图片边沿的小标签，图片只能缩小不能放大。尝试过很多方法都没办法解决，甚至检查了js源码，也没有发现有任何异常的地方。

Bootstrap中有影响的css：

*,

*:before,

*:after {

  -webkit-box-sizing: border-box;

     -moz-box-sizing: border-box;

          box-sizing: border-box;

}

我们只需要在页面上重新定义css来覆盖Bootstrap中的上述样式即可，如：

  .edui-container *{

    -webkit-box-sizing: content-box;

    -moz-box-sizing: content-box;

    box-sizing: content-box;

  }

  .edui-container *:before,

  .edui-container *:after {

    -webkit-box-sizing: content-box;

    -moz-box-sizing: content-box;

    box-sizing: content-box;

  }

* .edui-container为引用UEditor组件的父元素上使用的css class。

以上就是关于“Bootstrap与UEditor中Css冲突问题怎么解决”这篇文章的内容，相信大家都有了一定的了解，希望小编分享的内容对大家有帮助，若想了解更多相关的知识内容，请关注亿速云行业资讯频道。