CSS all

CSS 关键字initial 将属性的默认值分配给元素,可用于任何 CSS 属性,包括简写属性 all。

  • 如果将all设置为initial,则所有CSS属性都可以同时重置为其默认值,与单独重置每个属性相比,简化了过程.

  • 对于继承的属性,初始值可能会令人惊讶。最好使用替代方案,例如inherit, unset, revert 或 revert-layer关键字。

CSS initial - 基本示例

  • 在下面的示例中,color:initial; .content 类中的属性将内容区域的文本颜色设置为其初始值,覆盖任何先前的颜色声明。

  • 这可确保内容部分中的文本颜色恢复为浏览器样式表或用户代理样式表中指定的默认颜色。

<html>
<head>
  <style>
    body {
      font-family: Arial, sans-serif;
      margin: 0;
      padding: 0;
      background-color: #f4f4f4;
      color: red;
    }
    header {
      background-color: #050505;
      padding: 10px;
      text-align: center;
    }
    .content {
      margin: 20px;
      padding: 20px;
      background-color: #fff;
      border: 1px solid #ddd;
      color: initial; 
    }
    p {
      margin-bottom: 20px;
    }
  </style>
</head>
<body>
  <header>
    <h1>Header</h1>
  </header>
  <div class="content">
        <h2>主要内容</h2>
     <p>这是包含各种元素的主要内容区域。</p>
     <p>该段落的文本颜色设置为其初始值。</p>
  </div>
</body>
</html>