A Complete Guide to Web Design

Properties 415

CSS

Properties

Web Design in a Nutshell, eMatter Edition

repeat-x

Allows the image to repeat only horizontally

repeat-y

Allows the image to repeat only vertically

no-repeat

Displays the image only once (does not repeat)

background-attachment

Values:
scroll|fixed

Example:
BODY { background-image: url(oldmap.gif); background-attachment:
scroll }

Applies to:
All elements

Inherited:
No
This determines whether the background image scrolls along with the docu-
ment (the default) or remains in a fixed position.

background-position

Values:
percentage|length|top/center/bottom|left/center/right

Example:
BODY { background-image: url (oldmap.gif); background-position:
bottom left }
BODY { background-image: url (oldmap.gif); background-position:
100% 0% }

Applies to:
Block-level elements and replaced elements

Inherited:
No
When a background image has been specified, this property specifies its
initial position relative to the box that surrounds the content of the element
(not including its padding, border, or margin).
The CSS methods for specifying position get a bit complicated. Values are
given in horizontal/vertical pairs, with a default value of 0%/0%, which places
the upper-left corner of the image in the upper-left corner of the element. A
value of 100%/100% would place the image in the bottom-right corner of the
element.