How to use css background property

Background is an abbreviation attribute. You can set the background color, background position, background size, background tiling method, background image and other styles in one statement. The syntax is "background: color image position/size tiling method bg -origin draw area bg-attachment;".

css background property definition and usage

Background shorthand property sets all backgrounds in one statement Properties:

• background-color

• background-position

• ##background-size

• background-repeat

• background-origin

• background-clip

• background-attachment

##background-image
Syntax:

background:bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment ;

If you do not set one of the values, there will be no problem. For example, background:#ff0000 url('smiley.gif'); is also allowed.

It is generally recommended to use this attribute instead of using individual attributes separately, because this attribute is better supported in older browsers and requires fewer letters to be typed.

Example

How to set all background properties in one statement

body
  { 
  background: #00FF00 url(bgimage.gif) no-repeat fixed top;
  }

Browser support

All browsers support the background attribute.

Note: IE8 and earlier browsers do not support multiple background images for one element.

Note: IE7 and earlier browsers do not support "inherit". IE8 requires !DOCTYPE. IE9 supports "inherit".

The above is the detailed content of How to use css background property. For more information, please follow other related articles on the PHP Chinese website!