Читать книгу El gran libro de HTML5, CSS3 y Javascript - Diego Gauchat Juan - Страница 57
2.2.6.3 Referencias con el atributo class
ОглавлениеEn lugar de utilizar el atributo id
, la mayor parte de las veces es mejor usar el atributo class
para aplicar estilos. Este atributo es más flexible y se puede asignar a cada elemento HTML en el documento que tenga estilos en común.
Código 2-12
Crear referencias por el valor del atributo class
.
Para trabajar con la clase de atributo, hay que declarar la regla con un punto antes de su nombre. La ventaja es que de este modo la inserción del atributo clase con el valor texto1
será suficiente para asignar la misma regla a cualquier elemento.
Código 2-13
Asignar estilos a través del atributo class
.
Los elementos <p>
de las dos primeras líneas del interior del cuerpo en el Código 2-13 tienen el atributo class
con el valor texto1
. Como se dijo antes, la misma regla se puede aplicar a diferentes elementos en el mismo documento. Por tanto, estos dos primeros elementos comparten los mismos estilos y son modificados por la regla del Código 2-12. El último elemento <p>
no se ve afectado y mostrará los estilos por defecto. Las reglas asignadas por el atributo class
se llaman clases. A un elemento pueden asignarse varias clases. Todo lo que tenemos que hacer es declarar los nombres de las clases separadas por un espacio (por ejemplo, class= “texto1 texto2”
). La clase puede ser declarada exclusiva para ciertos tipos de elementos añadiendo un selector antes del punto.
Codigo 2-14
Declarar una clase solo para elementos <p>
.
En el Código 2-14 creamos una regla que hace referencia a la clase llamada texto1
pero solo para los elementos <p>
. Cualquier otro elemento con el mismo nombre para el atributo class
no se verá modificado por esta regla en particular.