HomeMenu
Jesus · Bible · HTML · CSS · JS · PHP · SVG · Applications

background-position

Description

The background-position property for CSS specifies the initial position of the background image.

Syntax

CSS

background-position: value;

JS

object.style.backgroundPosition = "value";

Values

<'background-position'> = <bg-position>
<bg-position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ center | [ left | right ] <length-percentage>? ] && [ center | [ top | bottom ] <length-percentage>? ]
left

Computes to 0% for the horizontal position if one or two values are given. Otherwise, specifies the left edge as the origin for the next offset.

center

Computes to 50% for the horizontal position if the horizontal position is not specified. Otherwise, specifies 50% for the vertical position.

right

Computes to 100% for the horizontal position if one or two values are given. Otherwise, specifies the right edge as the origin for the next offset.

top

Computes to 0% for the vertical position if one or two values are given. Otherwise, specifies the top edge as the origin for the next offset.

bottom

Computes to 100% for the vertical position if one or two values are given. Otherwise, specifies the bottom edge as the origin for the next offset.

<length-percentage> =
    <length> |
    <percentage>
<length>

Specifies the length using a number followed by a unit of measurement.

<percentage>

Specifies the percentage using a number followed by a percent sign (%).

Initial

0% 0%

Examples

1 · bottom

2 · center

3 · left

4 · length

5 · percentage

6 · right

7 · top

8 · JS