主页 / 问题 / 1250189
Accepted
Руслан Камов
Asked:2022-03-01 20:40:07 +0000 UTC2022-03-01 20:40:07 +0000 UTC

什么是级联级别？

  • 772

我以为我或多或少地理解了级联的主题，但结果并不完全。我理解这是在为同一元素或一组元素设置样式时发生冲突时浏览器遵循的一组规则。但是今天上网看revert属性的时候，看到了这个定义

revert (CSS) 关键字回滚当前级别的级联

现在我很困惑，这些是什么级联级别？

css

1 个回答

  1. Best Answer

    CSS 层叠是一种机制，通过它可以将多个 CSS 规则应用于 HTML 文档中的元素。规则可以来自各种来源：来自外部和内部样式表、继承机制、父元素、类和 ID、标签选择器、样式属性等。由于在这些情况下经常发生样式冲突，优先级系统：最终应用来自具有最高优先级的源的样式。

    revert (CSS) 关键字将级联的当前级别回滚，因此该属性采用它应该的值。

    例子：在此处输入图像描述

    1. 浏览器样式
    2. 您直接设置的样式
    3. 您通过父级设置的更多样式（但 all 关键字本身：revert; 意味着它为您设置它的元素返回，它将采用浏览器的默认样式）

    尝试全部删除：revert; 你会看到这个属性的所有魔力（在示例中，revert 只是删除了第二优先级的样式。） 

    h1, h2, h3, p, em, strong {
  color: red;
  background-color: yellow;
}

.revert * {
  all: revert;
}
    <div class="revert">
  <h1>h1</h1>
  <h2>h2</h2>
  <h3>h3</h3>
  <p>This is an example of some <strong>strong text</strong> and some  <em>emphasized text</em> set to all: revert. If it looks yellow and red, your browser does not support all revert just yet. </p>
</div>

    • 0

相关问题