Créer des classes et des règles de style personnalisées

  • Rversion finale: Zurich
  • Mis à jour 31 juil. 2025
  • 1 minute de lecture
  • Utilisez des règles de classes de style pour Générateur d'IU appliquer un style visuel personnalisé aux éléments d’interface utilisateur en faisant référence aux classes CSS.

    Avant de commencer

    Rôle requis : admin

    Pourquoi et quand exécuter cette tâche

    Contrôlez l’apparence des champs, des conteneurs, des boutons et d’autres composants d’interface sans écrire de styles en ligne, ce qui rend l’interface utilisateur plus propre, plus cohérente et plus facile à gérer. Toutes les classes et règles de style peuvent être appliquées à n’importe quel conteneur ou composant de la page. Pour plus d’informations sur les styles CSS, consultez le site ServiceNow Developer et le site ServiceNow Community.

    Procédure

    1. Accédez à la Tous > Cadre de travail Now Experience > Générateur d'IU.
    2. Ouvrez une expérience pour y travailler ou créez une expérience en sélectionnant Créer > Expérience.
      Consultez la rubrique Configurer la façon dont les utilisateurs interagissent avec vos applications dans Générateur d'IU pour plus d’informations sur la création d’expériences.
    3. Créer ou ouvrir une page.
    4. Ajoutez un composant à votre page.
    5. Sélectionnez l’onglet Styles dans le panneau de configuration.
    6. Sélectionnez l’icône ... en regard du champ Classe de style .
      La fenêtre contextuelle des classes et des règles de la page apparaîtra.Les classes et les règles des pages s’affichent.
    7. Facultatif : Sélectionnez + Ajouter une classe.
      1. Saisissez un nom dans le champ Nom de la classe Style .
      2. Fournissez le style CSS que vous souhaitez appliquer au composant.
      3. Sélectionnez Appliquer.
    8. Facultatif : Sélectionnez + Ajouter une règle.
      1. Saisissez un nom dans le champ Nom de la règle de style .
      2. Indiquez la règle CSS que vous souhaitez appliquer au composant.
      3. Sélectionnez Appliquer.
    9. Fermez la fenêtre Classes et règles de la page .
    10. Sélectionnez le champ Classe de style .
    11. Sélectionnez une classe de style ou une règle de style dans la liste.
    12. Sélectionnez Enregistrer.
    13. Sélectionnez Aperçu pour tester la classe de style appliquée ou la règle de style.