|
|
|
|
|
|
| |
The background-position property (CSS Reference)
Introduction
The background-position is used in conjunction with
background-image. It defines the absolute position of the image. This property
is useful if you set the background-repeat property to no-repeat. After that you
can position your image anywhere you want.
Example
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>background-position Demonstration</title>
<style type="text/css">
body
{
background-image:
url(http://topxml.com/images/topxml_site.gif);
background-repeat:
no-repeat;
background-position:
center;
}
</style>
</head>
<body>
</body>
</html>
Output
Values of the property
|
Name:
|
Description:
|
|
percentage
|
This value can be only used in a pair combination like “X
Y”. The first value is horizontal and the second value is vertical. So “50%
50%” would mean the image is positioned in center. Alternatively you can also
use “left center”. You can use any combination you like. Note that you have
to use a space between the pair values.
|
|
length
|
This value is also used in a pair combination. The
following values can be used:
cm (centimenter)
em (ems)
inch (inches)
mm (millimeters)
pc (picas)
px (pixels)
pt (points)
Again here you can also use the following keywords: left,
right, top, bottom, center
|
|
|
|
|
|
|
|
|
Email TopXML