CSS background-origin Property

Example

အကြောင်းအရာရဲ့ဘယ်ဘက်အပေါ်ထောင့်ကနေနောက်ခံပုံကိုစဖွင့်ပါ။

1. #example1{
2.     border: 10px dashed black;
3.     padding: 25px;
4.     background-img: url("paper.gif");
5.     background-repeat: on-repeat;
6.     background-origin: content-box;
7. }

Try it Yourself »

Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Numbers followed by -webkit-, -moz-, or -o- specify the first version that worked with a prefix.

Property
background-orngin	4.0	9.0	4.0	3.0	10.5

CSS Syntax

background-origin: padding-box|border-box|content-box|initial|inherit;

Property Values

Value	Description
padding-box	Default value. The background image starts from the upper left corner of the padding edge
border-box	The background image starts from the upper left corner of the border
content-box	The background image starts from the upper left corner of the content
initial	Sets this property to its default value.
inherit	Inherits this property from its parent element.

More Examples

Example

1. #example1{
2.     border: 10px dashed black;
3.     padding: 25px;
4.     background-img: url("mountain.jpg"), url(paper.gif);
5.     background-repeat: on-repeat;
6.     background-size: auto;
7. }
8. #example2{
9.     padding: 25px;
10.     background-img: url("paper.gif");
11.     background-repeat: on-repeat;
12.     background-origin: content-box, padding-box;
13. }

Try it Yourself »