Menu
Coddy logo textTech

Selettori di classe

Lezione 4 di 15 del corso Selettori CSS di Coddy.

Un selettore di classe è un tipo di selettore CSS che seleziona gli elementi che hanno uno specifico attributo class. L’attributo class è un attributo personalizzato che puoi aggiungere agli elementi HTML per raggrupparli.

Per selezionare gli elementi con una classe specifica, usa un punto (.) seguito dal nome della classe. Per esempio, il selettore .my-class seleziona tutti gli elementi che hanno la classe my-class.

Ecco un esempio di come usare un selettore di classe per applicare uno stile a una pagina web:

.my-class {
  color: red;
  font-size: 2em;
}

Per aggiungere una classe a un elemento, scrivi:

<div class="my-class"></div>

Questa regola CSS applicherà lo stile rosso e una dimensione del carattere di 2em a tutti gli elementi che hanno la classe my-class.

challenge icon

Sfida

Facile
  • Crea una pagina web con tre elementi h1.
  • Aggiungi una classe al primo elemento h1.
  • Aggiungi un'altra classe al secondo elemento h1.
  • Usa un selettore di classe CSS per impostare in rosso il primo elemento h1  e assegnargli una dimensione del carattere di 64px.
  • Usa un altro selettore di classe CSS per impostare in blu un altro elemento h1  e assegnargli una dimensione del carattere di 32px.

Provalo tu

<html>
<head>
  <title>Class Selector Exercise</title>
  <style>
    /* CSS Code goes here */
  </style>
</head>
<body>
  
</body>
</html>

Tutte le lezioni di Selettori CSS

Esercitati da solo: Playground Web