Métodos Avanzados / Entallando  Etiquetas Dependiendo de su Contexto

Entallando Etiquetas Dependiendo de su Contexto
(Customizing Tags Depending on Context)

También podemos preparar una regla CSS para que una versión entallada de una etiqueta pueda ser usada únicamente si la etiqueta aparece  dentro del contexto propio.   Esto quiere decir que, ésta regla solo tomará efecto cuando la etiqueta a ser reconfiguradaesté anidada dentro de otrs etiqueta específica (o sea la etiqueta mas hacia el centro dentro del orden de anidación que le  especifiquemos).

Como ejemplo, definimos la etiqueta <B>de una manera si está anidada dentro de una etiqueta <I>, pero una manera diferente sería si no está dentro de la etiqueta <I>: Example 8. De ésta manera es que definimos estas dos reglas diferentes para <B>:

    
B {font-size: 24pt; color: #32cd32;    
font-family: Arial, Helvetica, sans-serif;}    
    
I B {font-size: 18pt; color: #32cd32;    
font-family: Arial, Helvetica, sans-serif;    
background-color: #32CD99;}    

El archivo HTML para Example 8 contiene:

Some <b>really</b> boring text.    
Some <i><b>really</b></i> boring text.    

Notia ahora como especificamos la segunda regla CSS. Como es usual, las definiciones de las reglas están todas contenidas dentro de un par de paréntesis. También, como es usual, el nombre de la etiqueta a ser entallada está justo a las afureas de éstos paréntesis.  Pero ahora el nombre de la etiqueta que va a ser entallada está precedida por el nombre de otra etiqueta, la etiqueta en que la etiqueta que será entallada debe estar contenida. En este caso, laregla tomará efecto únicamente cuando aparezca la etiqueta <B> (propiamente anidada) dentro de la etiqueta <I>. Si desearíamos, podríamos requerir niveles adicionales de anidamientos antes de que la regla pueda ser aplicada; simplemente necesitamos especificar los nombres requeridos de las etiquetas, en el orden requerido, antes de que el nombre de la etiqueta pueda ser configurada dentro de una regla. (La primera etiqueta listada en las regla es la que está mas a las afueras de el nido; la próxima etiqueta en la lista debe estar anidada dentro de la primera etiqueta, etc. para que la regla tenga efecto.)

Por mera diversión, vamos a especificar una nueva regla con simplemente revirtiendo el orden del contexto de nuestra regla anterior y cambiando los valores de algunas propiedades: Example 8b.

    
B I {font-size: 18pt; color: #eeeeee;    
font-family: Arial, Helvetica, sans-serif;    
background-color: #666666;}    

Ahora hemos especificado una regla para la etiqueta <I> que es usada solo cuando la etiqueta <I> est;a anidada dentro de la etiqueta  <B>. Nota el diferente efecto en los dos casos en el ejemplo.  El ejemplo de archivo HTML ahora contiene:

    
Some <b>really</b> boring text.    
Some <i><b>really</b></i> boring text.    
Some <b><i>really</i></b> boring text.    

Estos mismos principios valen para especificar reglas contextuales para otras etiquetas