I campi del modulo, o form fields in inglese, possono essere modificati utilizzando vari selettori CSS. Ecco un esempio di come farlo.
Questo è il tuo codice HTML per un semplice modulo:
```
Il codice CSS per modificare l’aspetto di questi campi potrebbe essere simile al seguente:
```
/* Cambia l’aspetto di tutti i campi di input */
input[type=text] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
box-sizing: border-box;
border: 2px solid red;
border-radius: 4px;
}
/* Cambia l’aspetto del campo quando viene selezionato */
input[type=text]:focus {
background-color: lightblue;
}
```
In questo esempio, tutti i campi di input di tipo “text” avranno una larghezza del 100%, un padding di 12px in alto e in basso e 20px a destra e a sinistra, un margine di 8px sopra e sotto, una bordatura di 2px di colore rosso e un angolo arrotondato di 4px.
Quando un campo viene selezionato (ovvero quando è in stato di focus), il colore di sfondo cambia in azzurro chiaro.
È possibile modificare ulteriormente questi stili per adattarli alle proprie esigenze. Ad esempio, si può cambiare il tipo di bordo, il colore, l’ombra, ecc. Inoltre, è possibile creare stili differenti per diversi tipi di elementi del modulo come caselle di controllo, pulsanti, elenchi a discesa, ecc. usando i corrispondenti selettori CSS.
