Difference between revisions of "CSS GUIDE BACKGROUND POSITION"
(→Usage Examples) |
|||
| Line 2: | Line 2: | ||
== Summary == | == Summary == | ||
Use the background-position property to specify where a background image is placed. If the image repeats (horizontally, vertically or both) then it repeats from this location. If there is a single image, it is placed using the background-position property. | Use the background-position property to specify where a background image is placed. If the image repeats (horizontally, vertically or both) then it repeats from this location. If there is a single image, it is placed using the background-position property. | ||
| + | |||
| + | * Initial value: 0% 0% | ||
| + | * Applies to: all elements | ||
| + | * Inherited: no | ||
| + | * Percentages: refer to the size of the box itself | ||
| + | * Media: [[CSS:Media:Visual|visual]] | ||
| + | * Computed value: for <length> the absolute value, otherwise a percentage | ||
== Syntax == | == Syntax == | ||
| Line 22: | Line 29: | ||
== Specification Conformance == | == Specification Conformance == | ||
| + | |||
| + | * [http://www.w3.org/TR/CSS1#background-position CSS 1] | ||
| + | * [http://www.w3.org/TR/CSS21/colors.html#propdef-background-position CSS 2.1] | ||
| + | * [http://www.w3.org/TR/2005/WD-css3-background-20050216/#background-position CSS 3] | ||
== Browser Compatibility == | == Browser Compatibility == | ||
== See Also == | == See Also == | ||
Revision as of 20:05, 1 December 2006
This document is a work in progress and is subject to change.
Contents
Summary
Use the background-position property to specify where a background image is placed. If the image repeats (horizontally, vertically or both) then it repeats from this location. If there is a single image, it is placed using the background-position property.
- Initial value: 0% 0%
- Applies to: all elements
- Inherited: no
- Percentages: refer to the size of the box itself
- Media: visual
- Computed value: for <length> the absolute value, otherwise a percentage
Syntax
background-position: [left | right] [N% | Npx] [N% | Npx] [top | bottom];
Legal Values
Mozilla Recommended Values
Usage Examples
background-position: bottom right;
background-position: top right;
background-position: 20px 50px;
background-position: 50% 20%;
background-position: right 50%
background-position: 20% 50px;
background-position: right 20px;
