我将取消设置所有继承属性,但允许用户代理样式表。我该怎么做?正如您在代码中看到的,它禁用了所有样式,甚至用户代理样式表。如何防止禁用用户代理样式表?

h1, h2 {
    color: red;
    font-size: 24px;
    font-weight: bold;
}
.editor_data * {
    all: unset;
}

<div class="main_block">
    <h2>Should be red</h2>
    <div class="editor_data">
    <h1><u><em><strong>Should be underlined, bold, italics, but not red</strong></em></u></h1>
    </div>
</div>

最佳答案

尝试关键字revert而不是initialunset
revert关键字可用于将嵌入的小部件或组件与包含它们的页面样式隔离开来,特别是在与all属性一起使用时。
在用户样式表中,REVERT回滚层叠,并将属性重置为用户代理样式表建立的默认值。
MDN

h2 {
  color: red;
  font-size: 24px;
  font-weight: bold;
}

.editor_data * {
  all: revert;
}

<div class="main_block">
  <h2>Hello world!</h2>
  <div class="editor_data">

    <h1><u><em><strong>Hello world!</strong></em></u></h1>
  </div>
</div>

07-24 09:43
查看更多