html 编辑器样式 怎么与前台页面本身的样式不冲突

后台编辑器所添加的样式都是在追加或者重写某些公共样式，本人建议在公共样式表内写一套对你要发布内容的区域的样式进行重写，比如给这个区域放在一个DIV内，并且给一个单独的class，使这个区域内标签元素的所有样式属性全部清除或者重写，这样一来，你在后台编辑器所编辑的内嵌样式可以完全重写你样式表内的属性。

解决方法有很多，如果可以对html改动的话，就给你需要细化的页面元素加多一个class或者ID就行了，当然这种方法应该不是你想要的。那么接下来是不改变HTML的情况下，直接用css的方法来实现你想要的效果——\x0d\x0a方法一 细化选择符\x0d\x0a假如全局是这样来定义一个元素的样式的：.abc {background:#000}，同时这个class为abc的元素是隶属于某个元素的，比如下面这样的html代码结构\x0d\x0a\x0d\x0a\x0d\x0a\x0d\x0a\x0d\x0a那么在细化css里面，只需要在.abc前面加多一个父元素的选择符就行了：\x0d\x0a.container .abc {background:#fff}\x0d\x0a这样.container .abc的优先级就大于了.abc，自然细化css里面的background设置也就不会被全局CSS覆盖了~~\x0d\x0a\x0d\x0a方法二 提升样式的优先级\x0d\x0a这种方法个人不太推荐，相对而言会简单粗暴一些。同样是上面的例子，在细化CSS里面，只要在样式后面加一个!important，例如这样：\x0d\x0a.abc {background:#fff !improtant}\x0d\x0a这个样式的优先级就会默认提升到顶级，全局样式就无法影响到它了。\x0d\x0a\x0d\x0a方法三 改变两个样式的加载顺序\x0d\x0a这种方法比较简单，就是只要把细化css加载在全局css之后就行了，这样后面的样式就会自动覆盖前面的样式。不过如果你的html里面这两个样式表的加载顺序是先细化后全局的话，就要稍微调整一下代码才行。 回答于 2022-11-16

---