Partager via


Arrière-plan, boîtes de dialogue Nouveau style et Modifier le style

 

Publication: mars 2016

La catégorie Arrière-plan des boîtes de dialogue Nouveau style et Modifier le style permet de définir les règles de style d'une feuille de style en cascade (CSS) pour l'arrière-plan d'une page Web ou d'éléments individuels.  Vous pouvez appliquer ces règles de style aux éléments HTML ou les ajouter à la page active ou à une feuille de style externe.  

Pour définir une règle de style CSS d'arrière-plan pour les éléments d'interface utilisateur de la page active

  1. Ouvrez la page en mode Design ou Source.

  2. Vous pouvez sélectionner le texte ou les éléments HTML auxquels appliquer le style.

  3. Dans le menu Format, sélectionnez Nouveau style.

    La boîte de dialogue Nouveau style s'affiche.

  4. Dans le volet Catégorie, sélectionnez Arrière-plan.

    Les sélections de style d'arrière-plan s'affichent dans le volet de droite.

En mode Design, lorsque vous appliquez des styles au texte sélectionné, les attributs de style sont insérés inline dans le balisage HTML de la page.  Passez en mode Source pour contrôler les nouveaux attributs de style.  

Pour ajouter des attributs d'arrière-plan à une règle de style CSS définie dans une feuille de style externe

  1. Ouvrez une feuille de style externe existante.

  2. Placez le curseur entre les accolades de la règle de style à modifier.

  3. Effectuez l'une des actions suivantes.

    • Cliquez avec le bouton droit sur la feuille de style dans l'éditeur, puis dans le menu contextuel, choisissez Créer un style.

    • Dans la barre d'outils de feuille de style, choisissez Créer un style.

    La boîte de dialogue Modifier le style s'affiche.

  4. Dans le volet de gauche, sélectionnez Arrière-plan.

    Les sélections de style d'arrière-plan s'affichent dans le volet de droite.

Vous pouvez appliquer une classe de style CSS à un élément de la page Web ou à l'élément body en affectant la propriété class de l'élément au nom du sélecteur de classe.

Liste UIElement

Les tableaux suivants répertorient les options disponibles dans la catégorie Arrière-plan des boîtes de dialogue Nouveau style et Modifier le style.

Options d'arrière-plan

  • background-color
    Couleur d'arrière-plan d'un élément HTML.  Pour choisir parmi plus de couleurs, utilisez la flèche bas ou cliquez sur l'icône carrée sur la droite.  Pour plus d'informations, consultez Boîtes de dialogue Couleurs et Couleurs supplémentaires.  

  • background-image
    Image à utiliser pour l'arrière-plan d'une page Web.  L'image doit avoir déjà été ajoutée au projet.  Étant donné que l'image d'arrière-plan risque de ne pas être rendue, il est conseillé de définir également la couleur d'arrière-plan.  

  • background-repeat
    Façon dont une image d'arrière-plan est répétée.  Les valeurs sont les suivantes :  

    • no-repeat   L'image n'est pas répétée.

    • repeat   L'image est répétée verticalement et horizontalement.

    • repeat-x   L'image est répétée horizontalement.

    • repeat-y   L'image est répétée verticalement.

    • inherit   Le style background-repeat est hérité d'un élément parent.

  • background-attachment
    Indique si l'image d'arrière-plan est fixe ou si elle défile avec le reste de la page Web.  Les valeurs sont les suivantes :  

    • fixed   L'image est fixe et ne défile pas.

    • scroll   L'image défile avec le reste de la page Web.

    • inherit   Le style background-attachment est hérité d'un élément parent.

  • (x) background-position
    La position horizontale de l'image d'arrière-plan.  La spécification d'une valeur permet de sélectionner les unités dans la liste.  

  • (y) background-position
    Position verticale de l'image d'arrière-plan.  La spécification d'une valeur permet de sélectionner les unités dans la liste.  

Autres éléments d'interface utilisateur

  • Sélecteur
    (boîte de dialogue Nouveau style uniquement) Permet d'entrer un nom de classe ou de sélectionner l'élément HTML auquel appliquer le style.  Les noms de classe doivent commencer par un point (.).  Vous pouvez également sélectionner (style intraligne), qui permet d'appliquer inline le style au texte sélectionné ou aux éléments HTML.  

  • Définir dans
    (boîte de dialogue Nouveau style uniquement) Permet de spécifier l'emplacement d'écriture de la définition de la règle de style.  Les valeurs sont les suivantes :  

    • Page active   La règle de style est écrite dans un élément style de la page active.

    • Nouvelle feuille de style   Une nouvelle feuille de style CSS, dans laquelle est écrite la règle, est ajoutée au projet.

    • Feuille de style existante   La règle de style est ajoutée à la feuille de style CSS spécifiée via la liste URL.

  • URL
    (boîte de dialogue Nouveau style uniquement) Permet de sélectionner une feuille de style CSS existante.  Cette option n'est activée que lorsque Définir dans a la valeur Feuille de style existante.  

  • Appliquer un nouveau style à la sélection de document
    (boîte de dialogue Nouveau style uniquement) Indique que le style s'applique au texte, à la classe ou à l'élément HTML sélectionné.

  • Aperçu
    Affiche un exemple de mode d'affichage de la règle de style lorsqu'elle s'applique.

  • Description
    Affiche la définition CSS de la règle de style.

Voir aussi

Working with CSS Overview