Image background-position dans le CSS

Question 1

Je suis actuellement en train de passer par un site web bannière via chrome developer tools(Inspecter). J'ai remarqué que l'un particulier de la bannière a le jeu de règles suivant dans son CSS:

 banner{ 
     background-position:bottom;
     background-position-x: center;
     background-position-y: center;
  }

Est-ce juste une formalité?. Parce que, quand j'ai enlevé les trois propriétés de l'arrière et de définir background-position: centerla bannière n'a pas été affecté en aucune façon.

À partir d'un développeur wannabe. Merci

Question 2

Cette bannière a juste mauvais CSS.
background-position est une abréviation pour, background-position-x et background-position-y.

Donc,

banner { 
  background-position: bottom;
  background-position-x: center; /* This is not doing anything, because x became 'center' when it was omitted above. */
  background-position-y: center; /* This will override the previously set 'bottom' */
}

Comme vous l'avez mentionné, background-position: center fait le même travail, puisque x et y sont 'centre'.

Il n'y a rien de mal avec l'aide de mots clés, mais si vous êtes juste de commencer avec les CSS, je vous recommande fortement de vous habituer à l'aide de pourcentages.
(Vous me remercierez plus tard, quand vous avez besoin de plus le positionnement précis à l'aide de calc().

background: 0% 100% = background: left bottom
background: 100% 0% = background: right top
background: 50% 50% = background: center center

Source: https://developer.mozilla.org/en-US/docs/Web/CSS/background-position

LSE · Answer 1 · 2021-11-24T02:48:59

Cette bannière a juste mauvais CSS.
background-position est une abréviation pour, background-position-x et background-position-y.

Donc,

banner { 
  background-position: bottom;
  background-position-x: center; /* This is not doing anything, because x became 'center' when it was omitted above. */
  background-position-y: center; /* This will override the previously set 'bottom' */
}

Comme vous l'avez mentionné, background-position: center fait le même travail, puisque x et y sont 'centre'.

Il n'y a rien de mal avec l'aide de mots clés, mais si vous êtes juste de commencer avec les CSS, je vous recommande fortement de vous habituer à l'aide de pourcentages.
(Vous me remercierez plus tard, quand vous avez besoin de plus le positionnement précis à l'aide de calc().

background: 0% 100% = background: left bottom
background: 100% 0% = background: right top
background: 50% 50% = background: center center

Source: https://developer.mozilla.org/en-US/docs/Web/CSS/background-position

Image background-position dans le CSS

La question

La meilleure réponse

Dans d'autres langues

Cette page est dans d'autres langues

Populaires dans cette catégorie

Questions populaires dans cette catégorie