Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] CSS genérico para un grupo de clases

Estas en el tema de CSS genérico para un grupo de clases en el foro de CSS en Foros del Web. Hola a todos, Tengo una duda a la hora de dar estilos a un grupo de clases sin necesidad de llamar individualmente a cada una ...
  #1 (permalink)  
Antiguo 04/01/2014, 10:47
 
Fecha de Ingreso: junio-2012
Mensajes: 46
Antigüedad: 11 años, 9 meses
Puntos: 0
CSS genérico para un grupo de clases

Hola a todos,

Tengo una duda a la hora de dar estilos a un grupo de clases sin necesidad de llamar individualmente a cada una de ellas. Me explico, éstas clases comparten la cadena "group" y, dinámicamente a través de php, carga el ID de un módulo para añadirlo a la clase, de forma que quedan:

.group1
.group2
.group3

Y así sucesivamente.

En total salen más de 200 clases que van a compartir todas las propiedades. Sé que puedo llamarlas a todas y compartir atributos:

.group1, group2, group3 {
...
...
}

Pero son tantas clases que no sé si en CSS3 existe alguna forma para que pueda asignar las propiedades a una única clase:

.group {
...
...
}

Ésto anterior sé que no es correcto, pero... ¿Se puede hacer de alguna manera?

Un saludo.
  #2 (permalink)  
Antiguo 04/01/2014, 11:31
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 8 meses
Puntos: 2114
Respuesta: CSS genérico para un grupo de clases

¿Y para qué enumeras las clases si van a ser iguales?

Código CSS:
Ver original
  1. .group {}

...no te vale?
  #3 (permalink)  
Antiguo 04/01/2014, 11:50
 
Fecha de Ingreso: mayo-2013
Mensajes: 207
Antigüedad: 10 años, 11 meses
Puntos: 31
Respuesta: CSS genérico para un grupo de clases

Claro que puedes agrupar las propiedades identicas en una clase y mantener las diferencias en otras. Luego tendrás aplicar al elemento html la clase group y la groupN.

¿Por qué no sería correcto?
  #4 (permalink)  
Antiguo 04/01/2014, 11:58
 
Fecha de Ingreso: junio-2012
Mensajes: 46
Antigüedad: 11 años, 9 meses
Puntos: 0
Respuesta: CSS genérico para un grupo de clases

Cita:
Iniciado por pzin Ver Mensaje
¿Y para qué enumeras las clases si van a ser iguales?

Código CSS:
Ver original
  1. .group {}

...no te vale?
Es algo que he intentado pero creo que al final me va a dar mucho más trabajo. Las clases se enumeran dinámicamente ya que corresponden a módulos independientes. En concreto éstos son "group" pero hay muchísimos más que se generan de la misma forma a través de otro archivo auxiliar, de ahí que pretenda hacerlo mediante CSS.

Alzacón no sé si me he explicado mal o no te he entendido yo bien, lo que pretendo es a través de CSS cargar todas las clases groupN en una única clase sin llamar a las 200 group1, group 2,.... {} No sé si me explico.
  #5 (permalink)  
Antiguo 04/01/2014, 12:14
 
Fecha de Ingreso: mayo-2013
Mensajes: 207
Antigüedad: 10 años, 11 meses
Puntos: 31
Respuesta: CSS genérico para un grupo de clases

Tú tienes muchas clases que tiene propiedades repetidas y quieres agrupar esas propiedades, ¿no?

Pues pzin(creo) y yo te estamos diciendo de crear una clase que agrupe a las propiedades repetidas. Luego tendrias que llamar a la clase "agrupadora" y a la diferenciadora en el html.

Ejemplo con group dando tamaño y groupN definiendo el color de fondo
Código HTML:
Ver original
  1. <div class="group group1"></div>
  #6 (permalink)  
Antiguo 04/01/2014, 12:36
 
Fecha de Ingreso: junio-2012
Mensajes: 46
Antigüedad: 11 años, 9 meses
Puntos: 0
Respuesta: CSS genérico para un grupo de clases

Cita:
Iniciado por alzacon Ver Mensaje
Tú tienes muchas clases que tiene propiedades repetidas y quieres agrupar esas propiedades, ¿no?

Pues pzin(creo) y yo te estamos diciendo de crear una clase que agrupe a las propiedades repetidas. Luego tendrias que llamar a la clase "agrupadora" y a la diferenciadora en el html.

Ejemplo con group dando tamaño y groupN definiendo el color de fondo
Código HTML:
Ver original
  1. <div class="group group1"></div>
Efectivamente no te entendí yo bien antes. Es una posible solución similar a la que decía pzin, el problema es lo que comentaba en el anterior mensaje, aunque éstos compartan todos la cadena "group" hay otros muchos (miles) de módulos que se cargan a través del mismo archivo php pero con otros sufijos. Voy a investigar un poco la forma de hacerlo porque me parece una buena manera de solucionarlo aunque tengo que reprogramar algunas cosas.

Un saludo.
  #7 (permalink)  
Antiguo 04/01/2014, 12:57
 
Fecha de Ingreso: mayo-2013
Mensajes: 207
Antigüedad: 10 años, 11 meses
Puntos: 31
Respuesta: CSS genérico para un grupo de clases

También se podría seleccionar los elementos con las clases que empiecen por "group"
Código CSS:
Ver original
  1. [class^="group"]{}
Sólo funcionaria si el elemento tiene una cadena de clase que empieza por group. Yo usaría mejor lo de la clase "agrupadora" para evitar problemas futuros.
  #8 (permalink)  
Antiguo 04/01/2014, 17:16
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 8 meses
Puntos: 2114
Respuesta: CSS genérico para un grupo de clases

Realmente no es un problema de CSS. Ya que CSS prevé estas cosas y para eso existen las clases, para agrupar estilos que se repiten. Lo del selector de atributos es una solución si, pero me parece un tanto exagerado y equívoco.

El problema si acaso lo tienes desde PHP, de cómo definir las clases para unos u otros elementos. Porque en lo que es CSS está claro, mismos estilos, una clase y para los estilos que son diferentes, pues en otra clase.

Código CSS:
Ver original
  1. .group {
  2.   padding: 20px;
  3. }
  4.  
  5. .group.important {
  6.   background: red;
  7. }
  8.  
  9. .group.important.done {
  10.   border: 2px solid;
  11. }

Código HTML:
Ver original
  1. <p class="group"></p>
  2. <p class="group important"></p>
  3. <p class="group important done"></p>

Que es básicamente lo que ya te habíamos dicho.
  #9 (permalink)  
Antiguo 08/01/2014, 07:22
 
Fecha de Ingreso: junio-2012
Mensajes: 46
Antigüedad: 11 años, 9 meses
Puntos: 0
Respuesta: CSS genérico para un grupo de clases

Gracias chicos,

Al final lo he resuelto a través de PHP e indicando con CSS tal y como lo habéis planteado.

SOLUCIONADO

Gracias.

Etiquetas: clases, grupo
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 13:11.