22.12.2013 Views

W3C CSS2 Cascading Style Sheets, level 2 - instructional media + ...

W3C CSS2 Cascading Style Sheets, level 2 - instructional media + ...

W3C CSS2 Cascading Style Sheets, level 2 - instructional media + ...

SHOW MORE
SHOW LESS

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

User agents may treat ’fixed’ as ’scroll’. However, it is recommended they<br />

interpret ’fixed’ correctly, at least for the HTML and BODY elements, since there<br />

is no way for an author to provide an image only for those browsers that support<br />

’fixed’. See the section on conformance [p. 32] for details.<br />

’background-position’<br />

Value: [ [ | ]{1,2} | [ [top | center | bottom] ||<br />

[left | center | right] ] ] | inherit<br />

Initial: 0% 0%<br />

Applies to: block-<strong>level</strong> and replaced elements<br />

Inherited: no<br />

Percentages: refer to the size of the box itself<br />

Media: visual<br />

If a background image has been specified, this property specifies its initial<br />

position. Values have the following meanings:<br />

<br />

With a value pair of ’0% 0%’, the upper left corner of the image is aligned<br />

with the upper left corner of the box’s padding edge [p. 82] . A value pair of<br />

’100% 100%’ places the lower right corner of the image in the lower right<br />

corner of padding area. With a value pair of ’14% 84%’, the point 14%<br />

across and 84% down the image is to be placed at the point 14% across and<br />

84% down the padding area.<br />

<br />

With a value pair of ’2cm 2cm’, the upper left corner of the image is placed<br />

2cm to the right and 2cm below the upper left corner of the padding area.<br />

top left and left top<br />

Same as ’0% 0%’.<br />

top, top center, and center top<br />

Same as ’50% 0%’.<br />

right top and top right<br />

Same as ’100% 0%’.<br />

left, left center, and center left<br />

Same as ’0% 50%’.<br />

center and center center<br />

Same as ’50% 50%’.<br />

right, right center, and center right<br />

Same as ’100% 50%’.<br />

bottom left and left bottom<br />

Same as ’0% 100%’.<br />

bottom, bottom center, and center bottom<br />

Same as ’50% 100%’.<br />

bottom right and right bottom<br />

Same as ’100% 100%’.<br />

If only one percentage or length value is given, it sets the horizontal position<br />

only, the vertical position will be 50%. If two values are given, the horizontal position<br />

comes first. Combinations of length and percentage values are allowed,<br />

(e.g., ’50% 2cm’). Negative positions are allowed. Keywords cannot be combined<br />

191

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!