Ver Mensaje Individual
  #6 (permalink)  
Antiguo 13/02/2009, 11:34
Sandra1990
 
Fecha de Ingreso: febrero-2009
Mensajes: 4
Antigüedad: 15 años, 2 meses
Puntos: 0
Respuesta: Agrupar capas

Es extraño que no se pueda, sobre todo porque ahorraría bastante código en proyectos donde se parte de un mismo código html y simplemente se le da distinta apariencia mediante css, al estilo csszengarden

Imaginemos que tenemos el siguiente código html

Código:
<div id="menu">
   <div id="menu_op1"><a href="">enlace</a></div>
   <div id="menu_op2"><a href="">enlace</a></div>
   <div id="menu_op3"><a href="">enlace</a></div>
   <div id="menu_op4"><a href="">enlace</a></div>
   <div id="menu_op5"><a href="">enlace</a></div>
   <div id="menu_op6"><a href="">enlace</a></div>
</div>
y queremos aplicar una serie de estilos a los enlaces: 1,2,5 y 6

con el "método tradicional" nos quedaría, por ejemplo, el siguiente css

Código:
#menu_op1,#menu_op2,#menu_op5,#menu_op6
{ position:relative; width:200px; height:20px; background-color:#ccc }

#menu_op1 a,#menu_op2 a,#menu_op5 a,#menu_op6 a
{ color:#fff; font-weight:bold; text-decoration:none; }

#menu_op1 a:hover,#menu_op2 a:hover,#menu_op5 a:hover,#menu_op6 a:hover
{ color:#333; }
mientras que disponiendo de esta funcionalidad quedaría..

Código:
#grupo => #menu_op1,#menu_op2,#menu_op5,#menu_op6

#grupo
{ position:relative; width:200px; height:20px; background-color:#ccc }

#grupo a
{ color:#fff; font-weight:bold; text-decoration:none; }

#grupo a:hover
{ color:#333; }
Queda mucho más claro el código, se escribe menos código, y no se ha de modificar el html, lo que permite, en el siguiente proyecto que utiliza ese html, por ejemplo definir los estilos, esta vez para los enlaces 1,3 y 5

Alguien ha visto alguna vez algo parecido ?