Common Attributes: Background

The background of a container may be set using the background attributes backgroundColor, backgroundImage, backgroundSize, backgroundPosition, and backgroundRepeat.

Attributes

Name Description  
backgroundColor Specifies a background color. It can be set to any valid 6- or 3-digit hexadecimal color code or one of the 16 supported color names.
backgroundImage Specifies the skin to be used as the background image of a container.  
backgroundSize Specifies whether the background image should be stretched to fill the background of the container. The background image may be stretched horizontally, vertically, or in both directions; correspondingly, the value of this attribute can be set to stretch,auto, auto,stretch, or just stretch.
backgroundPosition Specifies the alignment of the background image in the container. The horizontal and vertical alignment are specified as a comma-separated pair; for example, a value of right,bottom aligns the image at the bottom-right of the container, whereas a value of left,center aligns it at the left horizontally and at the center vertically. A value of center aligns it at the center in both directions.
backgroundRepeat Specifies whether the background image should be repeated (tiled) in the container. The background image may be repeated horizontally, vertically, or in both directions; correspondingly, the value of this attribute can be set to repeatX, repeatY, or repeat.

Example

<?xml version="1.0"?>
<viewer xmlns="http://issuu.com/viewer/1.0" backgroundImage="#TwilightBackground"
 backgroundPosition="left,center" backgroundRepeat="repeatX">
 
 <skin source="skins.swf"/>
 
 ...
 
</viewer>

In the example above, the TwilightBackground skin is set as the background image for the Viewer, aligned at the center vertically, and repeated horizontally.

Note: If both backgroundColor and backgroundImage are set, the image is drawn in front of the solid color background.

 

Contents