Die background-originEigenschaft definiert, wo der Hintergrund gezeichnet werden soll: über das gesamte Element, innerhalb des Rahmens oder innerhalb der Polsterung.
Es gibt vier Werte: border-box, padding-box, content-boxund inherit. Hier ist eine Demo:
Siehe die Pen Background Origin-Demo von Timothy Miller (@tjacobdesign) auf CodePen.
background-origin ähnelt dem Hintergrundclip, ändert jedoch die Größe des Hintergrunds, anstatt ihn zu beschneiden.
Das obige Beispiel hat background-size: coverund gilt background-repeat: no-repeatauch. Wenn dies nicht der Fall wäre, würde sich das Bild unter dem Rand oder der Polsterung wiederholen.
verbunden
- Hintergrund-Anhang
- Hintergrund-Clip
- Hintergrundfarbe
- Hintergrundbild
- Hintergrundposition
- Hintergrund Wiederholung
- Hintergrundgröße
Mehr Ressourcen
- CSS3 Spec
- MDN
Browser-Unterstützung
| Chrom | Safari | Feuerfuchs | Oper | IE | Android | iOS |
|---|---|---|---|---|---|---|
| 1+ | 3+ | 4+ | 10,5+ | 9+ | Funktioniert | Funktioniert |