background-attachmentOmaisuus CSS määrittelee, miten siirtää taustan suhteen näyttöikkunan.
On olemassa kolme arvoa: scroll, fixedja local. Paras tapa selittää tämä on esittely (yritä vierittää yksittäisiä taustoja):
Katso Timothy Millerin (@tjacobdesign) kynän tausta -liitteiden esittely CodePenistä.
On kaksi mieltä, joista on syytä ajatella puhuessasi background-attachment: päänäkymä (selainikkuna) ja paikallinen näkymä (näet tämän yllä olevassa esittelyssä).
scrollon oletusarvo. Se vierittää päänäkymän kanssa, mutta pysyy paikallaan paikallisen näkymän sisällä.
fixedpysyy kiinteänä mitä tahansa. Se on eräänlainen kuin fyysinen ikkuna: liikkuminen ikkunan ympäri muuttaa näkökulmaa, mutta se ei muutu missä asiat ovat ikkunan ulkopuolella.
localkeksittiin, koska oletusarvo scrolltoimii kuin kiinteä tausta. Se vierittää sekä päänäkymää että paikallista näkymää. On joitain melko hienoja asioita, joita voit tehdä sen kanssa.
Liittyvät
- taustaleike
- taustaväri
- taustakuva
- tausta-alkuperä
- taustan sijainti
- tausta-toisto
- taustakoko
Lisää resursseja
- CSS3 Spec
- MDN
Selaimen tuki
fixedJa scrollarvoja tuetaan kaikkialla, vaikka fixedvoi käyttäytyä oudosti mobiililaitteissa. localonko tämä selaintuki:
Nämä selaintukitiedot ovat Caniuselta, jolla on tarkempia tietoja. Numero osoittaa, että selain tukee ominaisuutta kyseisessä versiossa tai uudemmassa.
Työpöytä
| Kromi | Firefox | IE | Reuna | Safari |
|---|---|---|---|---|
| 4 | 25 | 9 | 12 | 5 |
Matkapuhelin / tabletti
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | 85 | 4.2–4.3 | 14,0 - 14,4 |
Chrome-on-Android tukee local, mutta vanha Android-selain ei.