Erstellen Sie anwenderdefinierte Stilklassen und -Regeln

  • Freigeben Version: Zurich
  • Aktualisiert 31. Juli 2025
  • 1 Minute Lesedauer
  • Verwenden Sie Stilklassen-Regeln in UI BuilderDient zum Anwenden einer anwenderdefinierten visuellen Stile auf UI-Elemente, indem auf CSS-Klassen verwiesen wird.

    Vorbereitungen

    Erforderliche Rolle: Administrator

    Warum und wann dieser Vorgang ausgeführt wird

    Steuern Sie die Darstellung von Feldern, Containern, Schaltflächen und anderen Schnittstellenkomponenten, ohne Inline-Stile zu schreiben, um die UI bereinigen, konsistenter und einfacher zu verwalten. Alle Stilklassen und -Regeln können auf jeden Container oder jede Komponente auf der Seite angewendet werden. Weitere Informationen zu CSS-Stilen finden Sie unter ServiceNow-Entwickler-Website Und ServiceNow-Community-Website .

    Prozedur

    1. Navigieren zu Alle > Now-Experience-Framework > UI Builder.
    2. Öffnen Sie eine Experience, in der Sie arbeiten können, oder erstellen Sie eine Experience, indem Sie auswählen Erstellen > Experience.
      Siehe Konfigurieren Sie, wie Anwender mit Ihren Anwendungen in interagieren UI BuilderWeitere Informationen zum Erstellen von Experiences.
    3. Erstellen oder öffnen Sie eine Seite.
    4. Fügen Sie Ihrer Seite eine Komponente hinzu.
    5. Wählen Sie aus Stile Registerkarte im Konfigurationsbereich.
    6. Wählen Sie aus ... Symbol neben Stilklasse Feld.
      Die Seitenklassen und -Regeln Popup wird angezeigt.Popup für Seitenklassen und -Regeln.
    7. Wahlweise: Wählen Sie Aus + Klasse hinzufügen .
      1. Geben Sie einen Namen in ein Stilklassenname Feld.
      2. Geben Sie den CSS-Stil an, den Sie auf die Komponente anwenden möchten.
      3. Wählen Sie Übernehmen.
    8. Wahlweise: Wählen Sie Aus + Regel hinzufügen .
      1. Geben Sie einen Namen in ein Name der Stilregel Feld.
      2. Geben Sie die CSS-Regel an, die Sie auf die Komponente anwenden möchten.
      3. Wählen Sie Übernehmen.
    9. Schließen Sie Seitenklassen und -Regeln Popup.
    10. Wählen Sie aus Stilklasse Feld.
    11. Wählen Sie eine Stilklasse oder Stilregel aus der Liste aus.
    12. Wählen Sie Speichern.
    13. Wählen Sie Aus Vorschau Um die angewendete Stilklasse oder Stilregel zu testen.