Category: solid color background image background
1, the background color
background-color: color and any legal transparent
2, the background image
Image-background: url (images you want to load)
3, the background image tiling
background-repeat :
REPEAT : The default value of the horizontal vertical directions tiled
repeat-x: horizontal tile
repeat-y: vertical Tile
no-repeat: default does not tile
4, the background image size
size-background: VALUE1 value2 width height (px)
value% value% width height (%)
Cover : full coverage of all geometric background area enlarged to know completely covered background element
Contain : contains the background geometric amplification, until the bottom or right edge of a touch up element
5, fixed background image
background-attachment : fixed;(固定）
scorll (scroll)
6, background positioning
Change the background image in the default location elements
background-position: Note for the Firefox and Opera, background-Attachment must be set to "fixed" (fixed)
left(top,center,bottom)
right(top,center,bottom)
center(top,center,bottom)
% X Y% (note that the first value is the horizontal position, vertical position is the second value; 0% 0% is the upper left corner, lower right 100% 100% If only the other value is a value of 50%, The default is 0% 0%)
ypos xpos (first value is the horizontal position, vertical position is the second value; the unit may css pixels may be other units, only if the specified value is a value other 50%; and% Positions may be used)
inherit: Specifies the background-position property settings from the parent element should inherit
7, Sprite map, sprite
Action: some small background merge into the background to large, in order to achieve a reduction request to the server
Step: 1>, we create an element according to the size of the image
2>, the multiple images into one image, download all the required resources, with a single request, reducing the consumption of links
