---
title: Herencia
slug: Web/CSS/inheritance
tags:
  - CSS
  - 'CSS:Referencias'
  - Referencia_CSS
  - Todas_las_Categorías
translation_of: Web/CSS/inheritance
---
<p>{{ CSSRef() }}</p>

<h3 id="Resumen" name="Resumen">Resumen</h3>

<p>El resumen de cada <a href="es/Gu%c3%ada_de_referencia_de_CSS">definición de propiedad CSS</a> indica si esa propiedad es heredada por defecto ("Inherit: Yes") o no ("Inherit: no"). Esto controla lo que sucede al no especificar un valor concreto para una propiedad de un elemento.</p>

<h3 id="Propiedades_heredadas" name="Propiedades_heredadas">Propiedades heredadas</h3>

<p>Cuando no se especifica un valor para un elemento de una propiedad <strong>inherited property</strong>, el elemento toma el {{ Cssxref("computed value", "valor calculado") }} de la propiedad de su elemento padre. Sólo los elementos raíz de un documento obtienen el valor {{ Cssxref("initial", "inicial") }} dado en el resumen de la propiedad.</p>

<p>Un ejemplo característico de una propiedad heredada es la propiedad {{ Cssxref("color") }}. Definida con las siguientes reglas de estilo:</p>

<pre class="eval"> p { color: green }
</pre>

<p>y el código HTML siguiente:</p>

<pre class="eval"> &lt;p&gt;Este párrafo tiene &lt;em&gt;texto enfatizado&lt;/em&gt; en su interior.&lt;/p&gt;
</pre>

<p>las palabras "texto enfatizado" aparecerá en verde, ya que el elemento <code>em</code> ha heredado el valor de la propiedad {{ Cssxref("color") }} a partir del elemento <code>p</code>.<em>No</em> recoge el valor inicial de la propiedad (que es el color que es usado por el elemento raíz cuando la página especifica que no hay color).</p>

<h3 id="Propiedades_no_heredadas" name="Propiedades_no_heredadas">Propiedades no heredadas</h3>

<p>Si no se especifica un valor para una propiedad no heredada (<em>non-inherited property</em>) (a veces llamada <strong>reset property</strong> en el código Mozilla), el elemento toma el valor {{ Cssxref("initial", "inicial") }} de dicha propiedad (como se especifica en el resumen de ésa propiedad).</p>

<p>Un ejemplo característico de una propiedad no heredada es la del {{ Cssxref("border", "borde") }}. Definida con las siguientes reglas de estilo:</p>

<pre class="eval"> p { border: medium solid }
</pre>

<p>y la etiqueta HTML:</p>

<pre class="eval"> &lt;p&gt;Este párrafo tiene &lt;em&gt;texto enfatizado&lt;/em&gt; en su interior.&lt;/p&gt;
</pre>

<p>las palabras "texto enfatizado" no tendrán borde (ya que el valor inicial del {{ Cssxref("border-style", "estilo de borde") }} es <code>none</code>).</p>

<h3 id="Notas" name="Notas">Notas</h3>

<p>Las palabras de código {{ Cssxref("inherit") }} permiten al autor definir, explícitamente, la posibilidad de herencia. Funciona para las propiedades heredadas y las no heredadas.</p>

<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n">Ver también</h3>

<p>{{ Cssxref("inherit") }}, {{ Cssxref("Valor inicial") }}</p>

<p> </p>

<div class="noinclude">
<p><span class="comment">Categorías</span></p>

<p><br>
 <span class="comment">Interwiki Languages</span></p>
</div>

<p>{{ languages( { "en": "en/CSS/inheritance", "fr": "fr/CSS/H\u00e9ritage", "ja": "ja/CSS/inheritance", "pl": "pl/CSS/Dziedziczenie" } ) }}</p>