Añadir varias clases CSS en un solo elemento HTML

Mezclar dos estilos CSS en un solo elemento HTML es más sencillo de lo que parece y puede sacarnos de más de un atolladero. Se trata de hacer declaraciones de dos clases o más en un solo elemento html.

Este sería el HTML:

<a class="right red" href="#">ver demo</a>

Y este el CSS:

a.right {text-align: right;}
a.red {color: red;}

Aunque también puede hacerse así:
a.right.red {text-align: right; color: red;}

¿Te ha parecido útil este truco? Tú también puedes publicar el tuyo.

5 comentarios en “Añadir varias clases CSS en un solo elemento HTML

  1. Pero por ejemplo, tengo una libreria jQuery que como sabras se aplican a los elementos html mediante clases, pero despues a ese mismo elemento quiero adaptarle otro efecto con jQuery que tambien implementa clases en los elementos html, como le hago en ese caso??
    Otra pregunta aunado a esta primera… existe la posibilidad de agregar dos clases distintas en un mismo atributo class de un elemento html?, y si, si se puede, como seria???..

    Gracias por su respues, no saben cuanto me ayudara…
    Saludos…

    1. Martín, lástima que en 5 años nadie haya contestado a tu pregunta, eso es lo que yo necesito saber.
      Seguiré buscando por otro sítio más frecuentado.

  2. Yo tengo una clase button que da formato a los botones de acción y tengo una clase scrolly que proporciona un desplazamiento suave a los enlaces anclados a lugares de la misma página. Quiero anclar los botones y necesito usar las dos clases.

    Así no se hace, porque manda la segunda clase que se ejecuta y desaparece el botón:

    <a href="#" rel="nofollow">ver demo</a>

    Así funciona porque la orden class mezcla los atributos de las otras dos clases:

    <a href="#" rel="nofollow">ver demo</a>

    Las clases simplemente separadas, sin poner comas ni nada.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *