This summary from Silicon Valley is still front-end video
background-image: url ( "Picture the path") set the background image
范例：background-image:url("./source/img/1.jpg");
Gradient: Gradient is a picture , you need to set by background-image
background-image: linear-gradient () Linear Gradient
Linear gradient beginning, you can specify a direction of the gradient
to left/ to right/ to bottom /to top 默认 to bottom 范例：background-image:linear-gradient(to left,red,yellow);
xxxdeg xxx angle Examples : background-image: linear-gradient (45deg, red, yellow);
xturn x圈 范例： background-image:linear-gradient(.5turn,red,yellow);
Linear gradient can specify a plurality of colors simultaneously
范例：background-image:linear-gradient(red,yellow,blue,pink)
background-image: repeating-linear-gradient () repeating gradation (gradation is replaced solid)
范例：background-image:repeating-linear-gradient( red 30px, yellow 100 px);
background-image: radial-gradient (red, yellow) radial gradient (gradient radiation)
By default, the shape of the gradation center is calculated according to the element shape.
Can manually specify the size of the center (radial gradation range)
范例：background-image:radial-gradient(100px 100px,red ,yellow)
background-color: red; set the background color to red.
background-repeat: the background to set the repeat mode
Optional Value: repeat the default value of the background will be along the x axis, y axis Repeatability
repeat-x: x-axis direction is repeated
repeat-y: the y-axis is repeated release
no-repeat: the background image is not repeated
Examples: background-repeat: no-repeat;
background-position: set the background image position
Arrangement by top, left, right, bottom, center
background-clip: set the background range
Optional values: border-box defaults background will appear in the frame below
padding-box does not appear in the background of the border, it will only appear in the content area and padding
content-box background will only appear in the content area
background-orgin: background image shift amount calculating origin
Optional values: padding-box default value is calculated from the background-position of the padding
content-box background-position counted from the content area
Examples: background-origin: content-box
background-size: Set the background image size
The first value represents the width of the second value represents a height. If you write only one, the second is the default auto
Examples: background-size: 100px auto;
cover pictures the same proportion, the elements covered
Pictures contain the same proportion, the complete picture is displayed in the element.
background-attachment: the background image whether to follow the moving element
Optional values: scroll defaults background image will move with the elements
fixed background image is fixed on the page, do not move with the elements
范例：background-attachment:fixed