Todo depende.
A grandes rasgos las clases e ID's deberían estar dentro de contexto.
Es decir si tengo un menu con links, el listado debería llamarse #menu, o
algo por el estilo no #divVerde o cosas asi.

Otra recomendación es no poner nombres de atributos de css a id's o clases.
Ejemplo .rojito, .verdeAgua. Porque en el futuro pueden dejar de ser así.

Creo que lo más importante que debes tomar en cuenta es la especificidad del
estilo.

Un id tiene 100 puntos de especificidad.
Una clase tiene 10.
Un tag tiene 1.
Y el atributo style dentro del html tiene 1000.

Por que vengo con esto?
Porque si vos tenes un estilo asi:

#listado-productos .item-producto .caractericticas-producto
.wrapper-caracteristica-producto .content-caracteristica-producto
.atributo-producto

(Sumados = especificidad de 150 puntos)

Cuanto más especifico es el estilo tenés más control, pero se hace bastante
molesto de mantener, además de tener muchas líneas de código.

Yo te recomendaría que más de 3 o 4 anidadas no hagas.

Artículo acerca de especificidad:
http://css-tricks.com/specifics-on-css-specificity/

No se si eso te sirve pero bueno :p
Saludos,

Nacho



2008/10/23 Javier Guerrero <[EMAIL PROTECTED]>

> Hola chicos,
>
> Pues como dice el título de este post, ¿cómo coloco correctamente el nombre
> de un id o un class?
> La pregunta surgió porque me di cuenta que estaba creando algo como esto:
>
> #listado-productos .item-producto .caractericticas-producto
> .wrapper-caracteristica-producto .content-caracteristica-producto
> .atributo-producto{
> color:black;
> float:left;
> width:125px;
> padding-left: 10px;
> }
>
> Mi pregunta es ¿Es conveniente, en este ejemplo, poner insistentemente *
> -producto* como para indentificar bien un class?
>
> Otra pregunta es ¿Cuál es la  mejor forma aplicar los estilos?
>
> *Esto:*
> #listado-productos .item-producto .caractericticas-producto
> .wrapper-caracteristica-producto .content-caracteristica-producto
> .atributo-producto{
> color:black;
> float:left;
> width:125px;
> padding-left: 10px;
> }
>
> *o esto:*
> #listado-productos .atributo-producto{
> color:black;
> float:left;
> width:125px;
> padding-left: 10px;
> }
>
> La primera, me parece que me muestra claramente la estructura HTML,
> mientras
> la segunda pierdo ese detalle.
>
> ¿Qué me recomiendan'
>
> Por adelantado, gracias por su ayuda.
>
> Saludos cordiales.
> _______________________________________________
> Lista de distribución Ovillo
> Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
> Puedes modificar tus datos o desuscribirte en la siguiente dirección:
> http://lists.ovillo.org/mailman/listinfo/ovillo
>



-- 
↓۝ Ignacio Ricci
www.ignacioricci.com
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo

Responder a