Focus sur un endroit précis d'une image de background
2 years 2 months ago - 2 years 2 months ago #67064
by charly54
Focus sur un endroit précis d'une image de background was created by charly54
Bonjour,
On essaie tous d'optimiser ses présentations, pour les versions mobiles de nos pages.
Souvent nos bannières en pleine largeur ont une belle image de background.
Mais en version mobile l'image ne se centre pas sur la plus belle partie de l'image.
Voici les réglages pour positionner (centrer) une image de background d'un container, en version mobile.
Avec ce code CSS qui va positionner le centre de l'image à 38% de la largeur et 30 % de la hauteur de l'image de fond.
background-position: 38% 30%;
Regardez les images jointes, pour comprendre plus facilement ce que je voulais et comment je l'ai réglé via PBCK
PS : quand on est sur un plus grand écran, l'image semble se repositionner en son centre...
Donc pas de réglages supplémentaires à faire pour les autres écrans
On essaie tous d'optimiser ses présentations, pour les versions mobiles de nos pages.
Souvent nos bannières en pleine largeur ont une belle image de background.
Mais en version mobile l'image ne se centre pas sur la plus belle partie de l'image.
Voici les réglages pour positionner (centrer) une image de background d'un container, en version mobile.
Avec ce code CSS qui va positionner le centre de l'image à 38% de la largeur et 30 % de la hauteur de l'image de fond.
background-position: 38% 30%;
Regardez les images jointes, pour comprendre plus facilement ce que je voulais et comment je l'ai réglé via PBCK
PS : quand on est sur un plus grand écran, l'image semble se repositionner en son centre...

Donc pas de réglages supplémentaires à faire pour les autres écrans

Last edit: 2 years 2 months ago by charly54.
Please Log in or Create an account to join the conversation.
2 years 2 months ago #67068
by ced1870
Joomlack Webmaster and Developer
Replied by ced1870 on topic Focus sur un endroit précis d'une image de background
Salut et merci pour ton partage
il faut savoir que tu n'as pas besoin de passer par les css persos, il te suffit de mettre les positions dans les cases prévues à cet effet
CEd
il faut savoir que tu n'as pas besoin de passer par les css persos, il te suffit de mettre les positions dans les cases prévues à cet effet
CEd
Joomlack Webmaster and Developer
The following user(s) said Thank You: charly54
Please Log in or Create an account to join the conversation.
2 years 2 months ago #67074
by charly54
Replied by charly54 on topic Focus sur un endroit précis d'une image de background
Super Merci pour cette info Cédric
J'avais testé ces champs en mettant des valeurs sans les pourcentages.
Avec des valeurs sans pourcentage l'image se décale en laissant un espace ( et j'ai cru que cela allait faire la même chose avec les pourcentages)
J'avais testé ces champs en mettant des valeurs sans les pourcentages.
Avec des valeurs sans pourcentage l'image se décale en laissant un espace ( et j'ai cru que cela allait faire la même chose avec les pourcentages)
Please Log in or Create an account to join the conversation.
2 years 2 months ago #67077
by ced1870
Joomlack Webmaster and Developer
Replied by ced1870 on topic Focus sur un endroit précis d'une image de background
si tu ne mets pas d'unité, alors par défaut c'est en PX
Joomlack Webmaster and Developer
Please Log in or Create an account to join the conversation.
Time to create page: 0.217 seconds