Příloha na pozadí - Triky CSS

background-attachmentMajetek CSS Určuje, jak se pohybovat na pozadí vzhledem k výřezu.

Existují tři hodnoty: scroll, fixeda local. Nejlepší způsob, jak to vysvětlit, je pomocí ukázky (zkuste posouvat jednotlivé pozadí):

Podívejte se na ukázku přílohy pera od Timothy Millera (@tjacobdesign) na CodePen.

Existují dva různé pohledy, o kterých je třeba přemýšlet, když o nich mluvíme background-attachment: hlavní pohled (okno prohlížeče) a místní pohled (toto můžete vidět v ukázce výše).

scrollje výchozí hodnota. Posouvá se v hlavním zobrazení, ale zůstává fixní uvnitř místního zobrazení.

fixedzůstává fixní bez ohledu na to. Je to něco jako fyzické okno: pohyb po okně změní vaši perspektivu, ale to se nezmění tam, kde jsou věci mimo okno.

localbyl vynalezen, protože výchozí scrollhodnota funguje jako pevné pozadí. Posouvá se v hlavním i místním zobrazení. S tím můžete udělat pár skvělých věcí.

Příbuzný

klip na pozadí
barva pozadí
obrázek na pozadí
původ pozadí
pozice na pozadí
opakování pozadí
velikost pozadí

Další zdroje

CSS3 Spec
MDN

Podpora prohlížeče

Hodnoty fixeda scrolljsou podporovány všude, i když fixedse v mobilních zařízeních mohou chovat divně. localmá tuto podporu prohlížeče:

Tato data podpory prohlížeče pocházejí z Caniuse, který obsahuje více podrobností. Číslo označuje, že prohlížeč podporuje tuto funkci v dané verzi a vyšší.