Selettori ID

Lezione 5 di 15 del corso Selettori CSS di Coddy.

Un selettore ID è un tipo di selettore CSS che seleziona gli elementi che hanno uno specifico attributo ID. L’attributo ID è un attributo personalizzato che puoi aggiungere agli elementi HTML per identificarli in modo univoco.

Per selezionare gli elementi con uno specifico ID, usa il simbolo cancelletto (#) seguito dal valore ID. Per esempio, il selettore #my-id seleziona l’elemento con l’ID my-id.

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

#my-id {
  color: red;
  font-size: 2em;
}

Per aggiungere un ID a un elemento, scrivi:

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

Proprio come i selettori di classe, questa regola CSS applicherà all’elemento con l’ID my-id il colore rosso e una dimensione del carattere di 2em.

Sfida

Facile

Ecco un esercizio per verificare la tua comprensione dei selettori ID:

Crea una pagina web con due elementi div.
Assegna all'ID my-id il primo elemento div.
Usa un selettore ID per applicare uno stile all'elemento div con l'ID my-id, scegliendo un colore qualsiasi diverso dal nero e una dimensione del carattere di 30px.

Provalo tu

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

Tutte le lezioni di Selettori CSS

1Introduzione ai selettori CSS

Scopo dei selettori CSS Perché sono importanti?

4Selettori di attributo

Introduzione ai selettori di attributo Presenza e valori esatti Selettori di valori di attributo Selettori di valori di attributo II Selettori di valori di attributo III

2Selettori semplici

Selettori di tipo Selettori di classeSelettori IDSelettori universali

3Selettori combinatori

Selettore figlio Selettore discendente Selettore fratello adiacente Selettore fratello generale

Esercitati da solo: Playground Web