Bucaro TecHelp
HTTPS Encryption not required because no account numbers or
personal information is ever requested or accepted by this site

About BTH User Agreement Privacy Site Map Contact News Feeds

Set the Background Properties

By Stephen Bucaro

Use the background property as a shorthand method to set multiple background properties in one declaration. The properties must be in the order: color, image, position, repeat but you can leave some properties out and the browser will use a default value for those properties.

Below is an example of using inline style to set the border properties for a div.

<div style="background: #b0ffb0 url(bkgndimg.gif) top right no-repeat">Text</div>

Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text

These style rules result in a green background color with a purple image in the upper-right corner that does not repeat, but scrolls with the background.

background Syntax

background: color image position size repeat origin clip attachment

Property	Description
color	background color
image	background image
position	position of background image
size	size of the background image
repeat	no-repeat\|repeat\|repeat-x\|repeat-y
origin	position area of the background image
clip	painting area of the background image
attachment	whether the background image is fixed or scrolls

• One more attribute you can specify at end of the background property is inherit (requires no value). If the parent element sets the background property and the child element sets the background property, leaving out a value, the child element will use the value set in the parent.

More CSS Quick Reference:
• Set the Font Variant
• Descendant Selector
• Set the Border Style
• position:relative
• Style the First Letter
• position:absolute
• Set a Background Image's Position
• Set the Font Slant
• Set an Element's Visibility
• Set the Border Color