La background-originpropiedad define dónde pintar el fondo: en todo el elemento, dentro del borde o dentro del relleno.
Hay cuatro valores: border-box, padding-box, content-boxy inherit. Aquí hay una demostración:
Vea la demostración del origen del fondo de la pluma de Timothy Miller (@tjacobdesign) en CodePen.
background-origin es similar a background-clip, excepto que cambia el tamaño del fondo en lugar de recortarlo.
El ejemplo anterior ha background-size: covery background-repeat: no-repeattambién aplicada. Si ese no fuera el caso, la imagen se repetiría debajo del borde o el relleno.
Relacionado
- adjunto de fondo
- clip de fondo
- color de fondo
- imagen de fondo
- posición de fondo
- repetición de fondo
- tamaño de fondo
Más recursos
- Especificación CSS3
- MDN
Soporte del navegador
| Cromo | Safari | Firefox | Ópera | ES DECIR | Androide | iOS |
|---|---|---|---|---|---|---|
| 1+ | 3+ | 4+ | 10,5+ | 9+ | Trabajos | Trabajos |