---
title: inherit
slug: Web/CSS/inherit
tags:
  - CSS
  - CSS Value
  - inherit
translation_of: Web/CSS/inherit
---
<div> </div>

<p>{{CSSRef}}</p>

<p> <strong><code>inherit</code></strong> 关键字使得元素获取其父元素的<a href="/zh-CN/docs/Web/CSS/computed_value">计算值</a>。它可以应用于任何CSS属性，包括CSS简写 {{cssxref("all")}}。</p>

<p>对于<a href='https://developer.mozilla.org/zh-CN/docs/Web/CSS/inheritance#inherited_properties'>继承</a>属性，inherit 关键字只是增强了属性的默认行为，通常只在覆盖原有的值的时候使用。</p>

<p>继承始终来自文档树中的父元素，即使父元素不是包含块。</p>

<h2 id="示例">示例</h2>

<pre class="brush: css">/* 设置二级标题的颜色为绿色 */
h2 { color: green; }

/* ...but leave those in the sidebar alone so they use their parent's color */
#sidebar h2 { color: inherit; }
</pre>

<p>在下面这个例子中，如果sidebar 中<code>h2</code>元素的div匹配下面的规则的话，颜色会变成蓝色。</p>

<pre class="brush: css">div#current { color: blue; }
</pre>

<h2 id="规范">规范</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th>Specification</th>
   <th>Status</th>
   <th>Comment</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{ SpecName('CSS4 Cascade', '#inherit', 'inherit') }}</td>
   <td>{{Spec2('CSS4 Cascade')}}</td>
   <td>No changes from Level 3.</td>
  </tr>
  <tr>
   <td>{{ SpecName('CSS3 Values', "#common-keywords", "inherit") }}</td>
   <td>{{ Spec2('CSS3 Values') }}</td>
   <td>No significant change from {{ SpecName('CSS2.1') }}.</td>
  </tr>
  <tr>
   <td>{{ SpecName('CSS2.1', "cascade.html#value-def-inherit", "inherit") }}</td>
   <td>{{ Spec2('CSS2.1') }}</td>
   <td>Initial definition.</td>
  </tr>
 </tbody>
</table>

<h2 id="浏览器兼容性">浏览器兼容性</h2>

<div>


<p>{{Compat("css.types.global_keywords.inherit")}}</p>
</div>

<h2 id="See_also">See also</h2>

<ul>
 <li><a class="internal" href="/en-US/docs/CSS/inheritance" title="es/CSS/inheritance">Inheritance</a></li>
 <li>Use {{cssxref("initial")}} to set a property to its initial value.</li>
 <li>Use {{cssxref("unset")}} to set a property to its inherited value if it inherits, or to its initial value if not.</li>
 <li>Use {{cssxref("revert")}} to reset a property to the value established by the user-agent stylesheet (or by user styles, if any exist).</li>
 <li>The {{cssxref("all")}} property lets you reset all properties to their initial, inherited, reverted, or unset state at once.</li>
</ul>