未设置CSS无法正常工作。怎么解决?

时间:2019-04-12 12:33:54

标签: html css

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

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>

1 个答案:

答案 0 :(得分:3)

尝试使用关键字revert代替initialunset

  

revert关键字对于将嵌入式窗口小部件或组件与包含它们的页面的样式进行隔离非常有用,尤其是与all属性一起使用时。

     

在用户样式表中,还原会回滚级联,并将属性重置为由用户代理样式表建立的默认值

     

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>