1. Home
  2. CSS background properties

The best CSS background properties Tutorial In 2024, In this tutorial you can learn Examples,Browser Support,Tag definitions and instructions,grammar,related articles,

CSS background properties

Examples

Setting multiple background images in a div element (and specify their location):

body
{
background: #00ff00 url('smiley.gif') no-repeat fixed center;
}

Browser Support

Figures in the table represent the first browser to support the version number of the property.

Immediately following the digital -webkit-, -ms- or -moz- ago in support of the prefix attribute first browser version number.

属性
background 1.0 4.0 1.0 1.0 3.5

All major browsers support background attributes.

Note that IE8 and earlier versions do not support a plurality of elements of the background image.

Note that IE7 and earlier versions do not support "inherit" value.IE8 need to define! DOCTYPE. IE9 support the "inheritance."

Tag definitions and instructions

Background shorthand property can set all the background properties in one declaration.

Properties you can set are: background-color, background-position, background-size, background-repeat, background-origin, background-clip, background-attachment, and background-image.

If the above is missing a value, it does not matter, such as background: # FF0000 URL (smiley.gif); is allowed.

Defaults: Refer to the separate property
inherit: no
version: CSS1 + CSS3 new properties
JavaScript syntax: object object.style.background = "red url (smiley.gif) top left no-repeat"

grammar

background:color position size repeat origin clip attachment image;

value Explanation CSS
background-color Specifies the background color to use 1
background-position Specifies the location of the background image 1
background-size Specifies the size of the background image 3
background-repeat Specifies how to repeat a background image 1
background-origin Location area specified background image 3
background-clip Specifies the background image painting area 3
background-attachment Set the background image is fixed or scrolling with the rest of the page. 1
background-image Specify one or more background images to be used 1

related articles

CSS tutorial: CSS Background

CSS3 tutorial: CSS3 Backgrounds

Hot Tools

Other Tools

Online Tutorial

Website Navigation

CSS background properties
10/30