inheritance

  • Enlace amigable (slug) de la revisión: CSS/inheritance
  • Título de la revisión: inheritance
  • Id de la revisión: 167440
  • Creada:
  • Creador: Nathymig
  • ¿Es la revisión actual? No
  • Comentario arreglo enlaces y categorías

Contenido de la revisión

{{template.CSSRef()}}

Resumen

El resumen de cada definición de propiedad CSS 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.

Propiedades heredadas

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

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

 p { color: green }

y el código HTML siguiente:

 <p>Este párrafo tiene <em>texto enfatizado</em> en su interior.</p>

las palabras "texto enfatizado" aparecerá en verde, ya que el elemento em ha heredado el valor de la propiedad {{template.Cssxref("color")}} a partir del elemento p. No 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).

Propiedades no heredadas

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

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

 p { border: medium solid }

y la etiqueta HTML:

 <p>Este párrafo tiene <em>texto enfatizado</em> en su interior.</p>

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

Notas

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

Ver también

{{template.Cssxref("inherit")}}, {{cssxref|Valor inicial]]


Categorías


Interwiki Languages

{{ wiki.languages( { "en": "en/CSS/inheritance", "fr": "fr/CSS/H\u00e9ritage", "pl": "pl/CSS/Dziedziczenie" } ) }}

Fuente de la revisión

<p>
{{template.CSSRef()}}
</p>
<h3 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 name="Propiedades_heredadas"> Propiedades heredadas </h3>
<p>Cuando no se especifica un valor para un elemento de una propiedad <b>inherited property</b>, el elemento toma el {{template.Cssxref("computed value", "valor calculado")}} de la propiedad de su elemento padre. Sólo los elementos raíz de un documento obtienen el valor {{template.Cssxref("initial", "inicial")}} dado en el resumen de la propiedad.
</p><p>Un ejemplo característico de una propiedad heredada es la propiedad {{template.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 {{template.Cssxref("color")}} a partir del elemento <code>p</code>. <i>No</i> 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 name="Propiedades_no_heredadas"> Propiedades no heredadas </h3>
<p>Si no se especifica un valor para una propiedad no heredada (<i>non-inherited property</i>) (a veces llamada <b>reset property</b> en el código Mozilla), el elemento toma el valor {{template.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 {{template.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 {{template.Cssxref("border-style", "estilo de borde")}} es <code>none</code>).
</p>
<h3 name="Notas"> Notas </h3>
<p>Las palabras de código {{template.Cssxref("inherit")}} permiten al autor definir, explícitamente, la posibilidad de herencia. Funciona para las propiedades heredadas y las no heredadas.
</p>
<h3 name="Ver_tambi.C3.A9n"> Ver también </h3>
<p>{{template.Cssxref("inherit")}}, {{cssxref|Valor inicial]]
</p><p><br>
</p>
<div class="noinclude">
<p><span class="comment">Categorías</span>
</p><p><br>
<span class="comment">Interwiki Languages</span>
</p>
</div>
{{ wiki.languages( { "en": "en/CSS/inheritance", "fr": "fr/CSS/H\u00e9ritage", "pl": "pl/CSS/Dziedziczenie" } ) }}
Revertir a esta revisión