Selectores de clase
Lección 4 de 15 del curso Selectores CSS de Coddy.
Un selector de clase es un tipo de selector CSS que selecciona elementos que tienen un atributo de clase específico. El atributo de clase es un atributo personalizado que puedes añadir a los elementos HTML para agruparlos.
Para seleccionar elementos con una clase específica, se utiliza un punto (.) seguido del nombre de la clase. Por ejemplo, el selector .my-class selecciona todos los elementos que tienen la clase my-class.
Aquí tienes un ejemplo de cómo usar un selector de clase para dar estilo a una página web:
.my-class {
color: red;
font-size: 2em;
}Para añadir una clase a un elemento escribe:
<div class="my-class"></div>Esta regla CSS dará estilo a todos los elementos que tengan la clase my-class para que sean rojos y tengan un tamaño de fuente de 2em.
Desafío
Fácil- Crea una página web con tres elementos
h1. - Añade una clase al primer elemento
h1. - Añade otra clase al segundo elemento
h1. - Usa un selector de clase CSS para dar estilo al primer elemento
h1para que sea red y tenga un tamaño de fuente de 64px. - Usa otro selector de clase CSS para dar estilo a otro elemento
h1para que sea blue y tenga un tamaño de fuente de 32px.
Pruébalo tú mismo
<html>
<head>
<title>Class Selector Exercise</title>
<style>
/* CSS Code goes here */
</style>
</head>
<body>
</body>
</html>
Todas las lecciones de Selectores CSS
3Selectores combinadores
Selector de hijoSelector de descendienteSelector de hermano adyacenteSelector de hermano general