How to use Background-orgin in CSS3 (code attached)

This article brings you the content is about CSS3 in the use of Background-orgin (with code), there is a certain reference value, the need for a friend can refer to, I hope you have some help.

Sets the original starting position of the element's background picture.

Grammar:

Background-origin:border-box | Padding-box | Content-box;
The parameters indicate whether the background picture is from the border, the padding (the default), or the content area to begin displaying.

The effect is as follows:

It is important to note that if the background is not no-repeat, this property is not valid, it will be displayed starting from the border.

Instance code:

<! DOCTYPE html>