### [Anpassen der Likert-Skala-Feldtabelle](https://wpforms.com/developers/how-to-customize-the-likert-scale-field-table/)
**Veröffentlicht:** 6. Dezember 2019
**Autor:** Redaktionsteam
**Auszug:** Dieser Artikel zeigt Ihnen, wie Sie mit CSS das Styling der Likert-Skala in WPForms anpassen können.
**Inhalt:**
Möchten Sie das Styling des **Likert-Skala**-Formularfelds in WPForms anpassen? Wenn Sie das Styling dieses Felds an die Branding-Farben Ihrer Website anpassen möchten, zeigt Ihnen dieses Tutorial, wie es geht. Wir geben Ihnen das grundlegende CSS-Beispiel, das Sie zur Anpassung des **Likert-Skala**-Formularfelds benötigen.
## Erstellen Ihres Formulars
Wir beginnen mit der Erstellung des Formulars und dem Hinzufügen unserer Formularfelder, einschließlich der **Likert-Skala**.
Wenn Sie Hilfe beim Erstellen eines Formulars mit dem **Likert-Skala**-Formularfeld benötigen, [lesen Sie bitte die Dokumentation](https://wpforms.com/docs/how-to-add-a-likert-scale-field-to-wpforms/ "So fügen Sie ein Likert-Skala-Feld zu WPForms hinzu").
## Anpassen der Likert-Skala
Als Nächstes müssen Sie dieses CSS auf Ihre Website kopieren.
Wenn Sie nicht sicher sind, wie das geht, [lesen Sie bitte dieses Tutorial.](https://wpforms.com/developers/how-to-add-custom-css-styles-for-wpforms/ "So fügen Sie benutzerdefinierte CSS-Stile für WPForms hinzu")
```
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;
}
```
Die obige Formatierung ändert die Farben der geraden und ungeraden Zeilen sowie die Farbe der ausgewählten Option. Dieses CSS deckt auch die **modernen** oder **klassischen** Stile der **Likert-Skala** ab.
Sie müssen die **-971** ändern, da dies die Formular-ID für unser Beispiel ist. Sie müssen diese Nummer ändern, um Ihre eigene Formular-ID anzugeben.
Wenn Sie Hilfe bei der Suche nach Ihrer Formular-ID benötigen, [lesen Sie bitte diese Dokumentation.](https://wpforms.com/developers/how-to-locate-form-id-and-field-id/ "So finden Sie die Formular-ID und Feld-ID")
Und das ist alles! Nur durch die Verwendung von CSS können Sie das **Likert-Skala**-Styling in Ihrem Formular anpassen. Möchten Sie auch das Styling des **Net Promoter Score**-Formularfelds anpassen? Probieren Sie unser Tutorial [So passen Sie das Net Promoter Score-Feld an](https://wpforms.com/developers/how-to-customize-the-net-promoter-score-field/ "So passen Sie das Net Promoter Score-Feld an") aus.
## FAQ
#### F: Wie entferne ich den Zeilenumbruch bei meinen Optionen?
**A:** Standardmäßig fügt WPForms einen Zeilenumbruch zum Text hinzu, indem es CSS verwendet. Sie können dies entfernen, indem Sie zusätzliches CSS hinzufügen.
Denken Sie daran, die **-971** zu ändern, um Ihre Formular-ID anzugeben.
```
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;
}
```
**Kategorien:** Styling
**Schlagwörter:** CSS
---