### [Come stilizzare il testo segnaposto per i campi del modulo](https://wpforms.com/developers/style-placeholder-text-for-form-fields/)
**Pubblicato:** 14 ottobre 2019
**Autore:** Team Editoriale
**Estratto:** Questo snippet CSS ti aiuterà a stilizzare il testo segnaposto per adattarlo al tuo marchio personalizzato sul tuo sito.
**Contenuto:**
Sei interessato a personalizzare l'aspetto del testo segnaposto nei campi del tuo modulo WPForms? Con poche righe di CSS personalizzato, puoi ottenerlo facilmente. Il testo segnaposto funge da informazione temporanea all'interno di un campo e scompare quando un utente interagisce con il campo. Nel seguente articolo, ti guideremo attraverso il processo di stilizzazione del testo segnaposto per i tuoi campi del modulo.
Tieni presente che lo stile predefinito per il testo segnaposto può essere ereditato da diverse fonti, tra cui il tuo tema WordPress, le impostazioni di WPForms (a seconda delle tue impostazioni) o le impostazioni del browser dell'utente.
Prima di iniziare a stilizzare i segnaposto, dobbiamo prima creare un modulo che utilizzi questo testo. Una volta creato il tuo modulo, dovrai aggiungere il tuo testo **Segnaposto** per ogni campo dalla scheda **Avanzate** delle impostazioni del campo.
Se hai bisogno di aiuto per aggiungere testo segnaposto, [rivedi questa documentazione](https://wpforms.com/docs/how-to-add-placeholder-text-to-a-form-field/ "Come aggiungere testo segnaposto a un campo del modulo").
## Stilizzazione del testo segnaposto
Quando si stilizza il testo segnaposto, è essenziale includere diversi selettori, ognuno con il proprio prefisso del venditore. Ciò garantisce che gli stili vengano applicati in modo coerente su diversi browser e versioni. Sebbene il CSS possa sembrare ripetitivo, l'inclusione di tutti i selettori è fondamentale per un supporto completo del browser.
Per implementare questi stili sul tuo sito, aggiungi semplicemente il seguente CSS. Se non sei sicuro di dove o come aggiungere CSS personalizzato, puoi fare riferimento al nostro tutorial sull'argomento.
Il CSS fornito di seguito cambierà tutto il testo segnaposto di WPForms in un colore arancione (#e27730):
```
.wpforms-container ::-webkit-input-placeholder { /* Chrome e Safari */
color: #e27730 !important;
}
.wpforms-container :-moz-placeholder { /* Mozilla Firefox da 4 a 18 */
color: #e27730 !important;
opacity: 1 !important;
}
.wpforms-container ::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #e27730 !important;
opacity: 1 !important;
}
.wpforms-container :-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #e27730 !important;
}
.wpforms-container ::-ms-input-placeholder { /* Microsoft Edge */
color: #e27730 !important;
}
.wpforms-container ::placeholder {
color: #e27730 !important;
}
```
Firefox applicherà automaticamente una [opacità](https://www.w3schools.com/cssref/css3_pr_opacity.asp "Proprietà CSS opacity") inferiore a tutti i segnaposto dei campi del modulo, rendendoli più trasparenti rispetto ad altri browser.
Ciò è già stato affrontato nel CSS sopra impostando l'opacità per il CSS specifico di Firefox su **opacity: 1;**
E questo è tutto ciò che ti serve per stilizzare il testo segnaposto. Ti piacerebbe cambiare lo stile del messaggio di conferma usando il CSS? Nel nostro tutorial, [Come rimuovere lo stile della casella del messaggio di conferma](https://wpforms.com/developers/how-to-remove-confirmation-message-box-styling/ "Come rimuovere lo stile della casella del messaggio di conferma"), ti mostreremo come cambiare questo stile.
## FAQ
#### D: Posso usare questo CSS per stilizzare un campo a discesa?
**R:** Se desideri stilizzare il campo **a discesa**, [dai un'occhiata a questo articolo invece](https://wpforms.com/developers/how-to-style-the-dropdown-field/ "Come stilizzare il campo a discesa").
**Categorie:** Styling
**Tag:** CSS, Testo segnaposto
---