Já jsem v současné době prochází webové stránky banner přes chrome developer tools(Kontrolovat). Všiml jsem si, že konkrétní banner má následující pravidla v CSS:
banner{
background-position:bottom;
background-position-x: center;
background-position-y: center;
}
Je to jen formalita?. Protože, když jsem odstranil tři vlastnosti pozadí a nastavit background-position: center, banner nebyla ovlivněna v žádném případě.
Od developera rádoby. Díky
Že banner má jen špatné CSS.
background-position je zkratka pro: background-position-x a background-position-y.
Takže,
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' */
}
Jak jste zmínil, background-position: center dělá stejnou práci, protože obě x a y bude 'centrum'.
Není nic špatného s pomocí klíčových slov, ale pokud jste právě začíná s CSS, jsem důrazně doporučujeme, aby si zvyknout na používání procenta.
(Budete mi poděkovat později, když budete potřebovat více konkrétní polohy pomocí calc().
background: 0% 100% = background: left bottom
background: 100% 0% = background: right top
background: 50% 50% = background: center center
Zdroj: https://developer.mozilla.org/en-US/docs/Web/CSS/background-position