No entiendo esto de clase anidada AUXILIO

[Rodberry]

cual es la diferencia entre

p.estilo
{
propiedad:valor;
...

}



y:



.estilo
{
propiedad:valor:
..
}

Esta mas que claro que el primero afectara a todos los parrafos que tengan la clase estilo

y el segundo afectara a TODOS los elementos que contengan la clase estilo,

pero cual es la diferencia si en lugar de usar el primero opto por el segundo.

Porque si uso el primero me afectara los parrafos, y si uso el segundo tambien afecta a los parrafos si asi le designo la clase.

Para que sirve? que ventajas tiene?


<p class="estilo"....</p>

no entiendo ayuda

[cristian_cena]

pero cual es la diferencia si en lugar de usar el primero opto por el segundo

tu lo dijiste, que todos los elementos cuya clase sea "estilo" tomaran los estilos.
En cambio si le precedes de "p" (sin espacios) solo los <p> que tengan dicha clase tomaran los estilos.
Puede resultarte ventajoso para lograr mayor legibilidad de tu código.

[anavega]

Con eso puedes tener mas control sobre tus estilos.
por ejemplo

Código HTML:

<div class="noticia">
   <h2>Titulo</h2>
   <p>Contenido</p>
</div>
 
<div class="comentario">
   <span>Nombre</span>
   <p>Mensaje</p>
</div>
 

Con esta organizacion, tu facilmente puedes dar estilos diferentes al tag "p" dentro de el div noticias y otro estilo al que esta dentro de el div comentario

Código CSS:

div.noticia p {
 color : black;
}
 
div.comentario p {
 color: blue ;
}
 

[sergio1210]

Es útil para si por ejemplo tienes varias etiquetas diferentes con el mismo class y en un momento dado tu quieres que solo algunas de ellas se le les aplique esas propiedades.

Ejemplo:

HTML:

Código:

<h1 class="especial">Un encabezado</h1>
<p class="especial">Un párrafo</p>

CSS:

si quieres que tanto el h1 como el p tengan esas propiedades lo harás así:

Código:

.especial {.....}

Si solo quieres que tenga esas propiedades el párrafo

Código:

p.especial {.....}

No se trata de tener que optar por uno u otro, sino de saber que tienes esa opción en CSS por si se te da el caso que te pueda ser útil.

Un saludo