Application d’Images d’Arrière-Plan aux Éléments
La propriété background-image permet d’ajouter une image comme arrière-plan d’un élément HTML. La syntaxe de base est très simple :
background-image: url("image-url.jpg");
Comme valeur pour la propriété background-image, on utilise url(), et à l’intérieur de ces parenthèses, on précise l’URL de l’image.
index.html
index.css
background-repeat
Détermine si l’image sera répétée horizontalement, verticalement, dans les deux directions ou pas du tout.
background-repeat: repeat | repeat-x | repeat-y | no-repeat;
index.html
index.css
background-position
background-position est utilisé pour définir la position de départ d'une image de fond à l'intérieur de la zone de fond d'un élément. Cette propriété permet de spécifier où l'image de fond doit être placée et comment elle doit être positionnée par rapport à l'élément. Il est nécessaire de définir la position sur les axes x et y
background-position: x y
index.html
index.css
background-size
Contrôle la façon dont l'image de fond est redimensionnée :
background-size: auto | cover | contain | value in px/em/rem;
auto: taille d'origine de l'image ;cover: remplit entièrement l'élément, peut être rognée ;contain: adapte toute l'image, peut laisser de l'espace vide ;value: taille personnalisée (par exemple,100px50px,50%).
index.html
index.css
1. Que fait la propriété background-image ?
2. Que fait la propriété background-repeat ?
3. Quelle propriété détermine la position de l'image d'arrière-plan d'un élément ?
Merci pour vos commentaires !
Demandez à l'IA
Demandez à l'IA
Posez n'importe quelle question ou essayez l'une des questions suggérées pour commencer notre discussion
Can you show me an example of how to use all these background properties together?
What is the difference between `cover` and `contain` for background-size?
How do I center a background image both vertically and horizontally?
Génial!
Completion taux amélioré à 2.56Application d’Images d’Arrière-Plan aux Éléments
Glissez pour afficher le menu
La propriété background-image permet d’ajouter une image comme arrière-plan d’un élément HTML. La syntaxe de base est très simple :
background-image: url("image-url.jpg");
Comme valeur pour la propriété background-image, on utilise url(), et à l’intérieur de ces parenthèses, on précise l’URL de l’image.
index.html
index.css
background-repeat
Détermine si l’image sera répétée horizontalement, verticalement, dans les deux directions ou pas du tout.
background-repeat: repeat | repeat-x | repeat-y | no-repeat;
index.html
index.css
background-position
background-position est utilisé pour définir la position de départ d'une image de fond à l'intérieur de la zone de fond d'un élément. Cette propriété permet de spécifier où l'image de fond doit être placée et comment elle doit être positionnée par rapport à l'élément. Il est nécessaire de définir la position sur les axes x et y
background-position: x y
index.html
index.css
background-size
Contrôle la façon dont l'image de fond est redimensionnée :
background-size: auto | cover | contain | value in px/em/rem;
auto: taille d'origine de l'image ;cover: remplit entièrement l'élément, peut être rognée ;contain: adapte toute l'image, peut laisser de l'espace vide ;value: taille personnalisée (par exemple,100px50px,50%).
index.html
index.css
1. Que fait la propriété background-image ?
2. Que fait la propriété background-repeat ?
3. Quelle propriété détermine la position de l'image d'arrière-plan d'un élément ?
Merci pour vos commentaires !
