Re: CSS tutorial: a detailed explanation of the location of the background picture

Here we may understand how to locate a background picture with the location value in background, and go back to see the two pictures introduced at the beginning, and we can use the two properties of the background location and the container to make a random call to some part of the whole picture.

but we need some rules to arrange these small pictures for convenience, for example, the distance between the small pictures is usually the size of the container that calls the small graph, or the larger distance, so that the pictures we don't want to display in the container will be avoided!

add a bit, if the location is used percentage, the algorithm is special. Let me give an example:

[code]background:#FFF URL (image) no-repeat fixed 50% -30%; [/code]

Where should the picture be in the container, the algorithm formula is as follows:

the left top coordinates of the left top of the container are: (the width of the container - the width of the picture) / >y: (the height of the container - the height of the picture) x (-30%)
the result applied to the coordinate rule. If the difference is negative and the percentage is positive, the result is negative. If the difference is negative and the percentage is negative, then the result is positive. In a word, the operation here is in accordance with the algorithm. Taking the result of the computation into the coordinate rule, we can get the location of the picture.

for example: the container is width:600px; height:600px; and the picture is width:200px; height:200px;
we use the above style to get the picture position as:
x: (600px-200px) *50%
y:. 10/21/1136056j1s30d37eef66q3.gif border="0">