Las clases de CSS le brindan flexibilidad adicional para especificar qué elementos recibirán un estilo particular.
Hace unas lecciones, aprendimos sobre los selectores . Puede recordar que los selectores son las cosas contra las que aplicamos un estilo. En nuestros ejemplos, nuestros selectores fueron todos elementos HTML. Por ejemplo, decidimos hacer el
<h1>elemento azul.
Ahora, eso funciona bien si quieres que todos los encabezados sean azules. Pero, ¿qué pasa si solo quieres que algunos de tus encabezados sean azules? Quizás desee que el color de sus encabezados refleje la sección del sitio en el que se encuentra.
¡Parece que necesitas usar clases!
En CSS, las clases le permiten aplicar un estilo a una clase dada de un elemento. Para hacer esto, vincula el elemento al estilo declarando un estilo para la clase y luego asignando esa clase al elemento.
Sintaxis de la clase CSS
Declara una clase CSS utilizando un punto (.) Seguido del nombre de la clase. Usted mismo inventa el nombre de la clase. Después del nombre de la clase, simplemente ingrese las propiedades / valores que desea asignar a su clase.
Si desea utilizar el mismo nombre de clase para varios elementos, pero cada uno con un estilo diferente, puede prefijar el punto con el nombre del elemento HTML.
Por ejemplo:
Ejemplo de clase CSS
También puede seleccionar elementos (o clases) que están anidados dentro de otro elemento o clase. Por ejemplo,
div.css-section pseleccionará todos los <p>elementos que están anidados dentro de un <div>elemento que usa la .css-sectionclase.
Una de las principales ventajas de hacer esto es que no necesita aplicar una clase a cada instancia de un elemento cuando está anidado dentro de otro elemento que usa una clase.
Aquí hay un ejemplo:
No hay comentarios.:
Publicar un comentario
Dejanos tu comentario para seguir mejorando!