[2016-01-17] [CSS] [background-related properties]
- Background-related properties
- Background-coclor Setting the background color
- background-image Setting a background image
- Background-image: "Picture url";
- Background-image:none; none, default value
- Background-image:inherit; inherit the parent element
- background-repeat: Set whether and how to repeat the background image
- background-repeat:repeat; default, background picture in horizontal and vertical reverse repetition
- background-repeat:repeat-x; Background image is repeated in horizontal direction
- background-repeat:repeat-y; Background image is repeated in the vertical direction
- background-repeat:no-repeat; Background image is displayed only once
- Background-repeat:inherit; inherit a parent element
- background-position: Set the starting position of the image
- There are two values, the first value describes X, and the second value describes Y
- Left
- Right
- In center
- Top Tops
- Bottom Bottom
- If only one value is specified, the other value defaults to the center
- X y%
- If only one value is specified, the other value defaults to 50%.
- Xpx ypx
- If only one value is specified, the other value defaults to (yes, not px is%)
- background-attatchment: Sets whether the background image moves with other parts of the page
- Background-attatchment:scroll default value, moving
- background-attatchment:fixed fixed
- Background-attatchment:inherit Inheriting parent elements
- Background-clip The drawing area of the specified background
- Background-clip:border-box: The background is clipped to the bounding box
- Background-clip:padding-box: The background is clipped to the inner margin border
- Background-clip:content-box the background is clipped to the content box
- Background-origin Specifies where the background-position attribute is positioned relative to
- Background-origin:padding-box background relative to the inner margin box to locate
- Background-origin:border-box; the background is positioned relative to the bounding box.
- Background-origin:conten-box the background relative to the content of the converse to locate
- background-size Specify the size of the background image
- Background-size: Width height
- If only the first value is set, the second value is set to Auto
- background-size:%%
- If only the first value is set, the second value is set to Auto
- background-size:cover; enlarge the image to fit the border (i.e. enlarge the image, then put in, the image may not be part of the frame)
- Background-size:contain; Stretch The image to fit the border
From for notes (Wiz)
[2016-01-17] [CSS] [background-related properties]
