background position

The background-position property is used specify the top and the left of the background image relative to the top and the left of the element box.

The possible values are.

PropertiesDescription
<percentage>
<length>
left | center | rightfor horizontal direction
top | center | bottomfor vertical direction


For example
background-position : 30px 50px    /* first value applies to horizontal direction,  
second value apply to vertical direction*/
background-position : left bottom
background-position : 10% /* applies to both the vertical and horizontal direction.*/

snippet
<html>
<head>
<style>
p {margin: 10px}
body * {background-image: url(bg.jpg)}
</style>
</head>
<body style="background-image: url(image.png);background-position: 0px">
<p style="background-position: 0px"> Say it before it's too late.</p>
<p style="background-position: 10px"> Say it before it's too late.</p>
<p style="background-position: -10px 10%"> Say it before it's too late.</p>
<p style="background-position: 6% -6%"> Say it before it's too late.</p>
<p style="background-position: 6cm"> Say it before it's too late.</p>
</body>
</html>
Related Tutorial
2. Padding
3. Margin
4. Border
5. Cursors