### [Come personalizzare la tabella del campo Scala Likert](https://wpforms.com/developers/how-to-customize-the-likert-scale-field-table/)
**Pubblicato:** 6 dicembre 2019
**Autore:** Team editoriale
**Estratto:** Questo articolo ti mostrerà come utilizzare il CSS per personalizzare lo stile della scala Likert in WPForms.
**Contenuto:**
Vuoi personalizzare lo stile del campo modulo **Scala Likert** in WPForms? Se desideri modificare lo stile di questo campo per abbinarlo ai colori del marchio del tuo sito, questo tutorial ti mostrerà come fare. Ti forniremo l'esempio CSS di base necessario per personalizzare il campo modulo **Scala Likert**.
## Creazione del tuo modulo
Inizieremo creando il modulo e aggiungendo i nostri campi modulo, inclusa la **Scala Likert**.
Se hai bisogno di assistenza nella creazione di un modulo con il campo modulo **Scala Likert**, [rivedi la documentazione](https://wpforms.com/docs/how-to-add-a-likert-scale-field-to-wpforms/ "Come aggiungere un campo Scala Likert a WPForms").
## Personalizzazione della Scala Likert
Successivamente, dovrai copiare questo CSS sul tuo sito.
Se non sei sicuro di come farlo, [rivedi questo tutorial.](https://wpforms.com/developers/how-to-add-custom-css-styles-for-wpforms/ "Come aggiungere stili CSS personalizzati per WPForms")
```
form#wpforms-form-971 .wpforms-field-likert_scale table.classic thead tr {
background-color: #FFE0B2;
}
form#wpforms-form-971 .wpforms-field-likert_scale table.modern tbody tr td input[type=radio]:checked+label:after,
form#wpforms-form-971 .wpforms-field-likert_scale table.modern tbody tr td input[type=checkbox]:checked+label:after,
form#wpforms-form-971 .wpforms-field-likert_scale table.classic tbody tr td input[type=radio]:checked+label:after,
form#wpforms-form-971 .wpforms-field-likert_scale table.classic tbody tr td input[type=checkbox]:checked+label:after {
background-color: #FF9800;
}
form#wpforms-form-971 .wpforms-field-likert_scale table.modern tbody tr td label:hover:after,
form#wpforms-form-971 .wpforms-field-likert_scale table.classic tbody tr td label:hover:after{
border: 1px solid #EF6C00;
}
form#wpforms-form-971 .wpforms-field-likert_scale table.modern tbody tr:nth-child(odd) th,
form#wpforms-form-971 .wpforms-field-likert_scale table.modern tbody tr:nth-child(odd) td,
form#wpforms-form-971 .wpforms-field-likert_scale table.classic tbody tr:nth-child(odd) th,
form#wpforms-form-971 .wpforms-field-likert_scale table.classic tbody tr:nth-child(odd) td {
background-color: #FFF3E0;
}
form#wpforms-form-971 .wpforms-field-likert_scale table.modern tbody tr:nth-child(even) th,
form#wpforms-form-971 .wpforms-field-likert_scale table.modern tbody tr:nth-child(even) td,
form#wpforms-form-971 .wpforms-field-likert_scale table.classic tbody tr:nth-child(even) th,
form#wpforms-form-971 .wpforms-field-likert_scale table.classic tbody tr:nth-child(even) td {
background-color: #FFE0B2;
}
```
Lo stile sopra cambierà i colori delle righe pari e dispari, nonché il colore dell'opzione quando selezionata. Questo CSS copre anche gli stili **Modern** o **Classic** della **Scala Likert**.
Dovrai cambiare il **-971** poiché questo è l'ID del modulo per il nostro esempio. Dovrai aggiornare questo numero per corrispondere al tuo ID modulo.
Se hai bisogno di aiuto per localizzare il tuo ID modulo, [rivedi questa documentazione.](https://wpforms.com/developers/how-to-locate-form-id-and-field-id/ "Come localizzare l'ID del modulo e l'ID del campo")
E questo è tutto! Semplicemente usando il CSS puoi personalizzare lo stile della **Scala Likert** sul tuo modulo. Vuoi anche personalizzare lo stile del campo modulo **Net Promoter Score**? Prova il nostro tutorial su [Come personalizzare il campo Net Promoter Score](https://wpforms.com/developers/how-to-customize-the-net-promoter-score-field/ "Come personalizzare il campo Net Promoter Score").
## FAQ
#### D: Come rimuovo l'interruzione di parola sulle mie opzioni?
**R:** Per impostazione predefinita, WPForms aggiunge un'interruzione di parola al testo utilizzando il CSS. Puoi rimuoverla aggiungendo CSS aggiuntivo.
Ricorda di cambiare il **-971** per corrispondere al tuo ID modulo.
```
form#wpforms-form-971 .wpforms-field-likert_scale table.classic th,
form#wpforms-form-971 .wpforms-field-likert_scale table.modern th {
word-break: auto-phrase;
}
```
**Categorie:** Stile
**Tag:** CSS
---