WordPress中如何清除主题生成div优先级高于class的inline样式

方案1：使用CSS !important 规则覆盖（最便捷） #

行内样式优先级仅低于!important标记的样式，直接给需要覆盖的属性加上!important即可生效：

• 仅覆盖指定行内样式示例（假设目标div class为target-div，要覆盖行内的margin和background属性）：

.target-div {
  margin: 0 !important;
  background: transparent !important;
  /* 其他需要覆盖的属性都加!important即可 */
}

• 如需清空所有行内样式，直接使用all属性：

.target-div {
  all: unset !important;
  /* 之后再自定义需要的样式即可 */
}

如果class选择器不够精准，可以叠加父级元素的类名缩小选择范围，比如.page-content .target-div { ... }。

方案2：使用JavaScript直接移除行内样式属性（彻底清除） #

如果不想用!important，可以直接删除元素的style属性，在WordPress后台的「自定义」-「自定义JS」中添加如下代码即可：

• 单个目标div：

document.querySelector('.target-div').removeAttribute('style');

• 多个同类型目标div：

document.querySelectorAll('.target-div').forEach(item => {
  item.removeAttribute('style');
})

方案3：WordPress主题层面移除（适合有代码基础的用户） #

如果能定位到主题生成该行内样式的钩子，可以通过add_filter修改对应输出逻辑，从根源避免行内样式生成，具体实现需要对应主题的源码结构调整。

内容的提问来源于stack exchange，提问作者John