Difference between revisions of "CSS: Backgrounds"

m (Undo revision 85079 by Dli00105 (talk))
(Tags: Blanking, Undo)
Line 1: Line 1:
 +
==Background==
 +
You can use the <syntaxhighlight>background</syntaxhighlight> CSS property to modify the background of an element. The background consists of several parts.
  
 +
==Background Color==
 +
The <syntaxhighlight>background-color</syntaxhighlight> property modifies the color of the background. For example, the code
 +
 +
<syntaxhighlight lang="html" inline>
 +
div{
 +
    background-color: red;
 +
}
 +
</syntaxhighlight>
 +
 +
will create the following:
 +
 +
<div style="background-color: red; width: 50px; height: 50px;"></div>
 +
 +
==Background Image==
 +
You can use the <syntaxhighlight>background-image</syntaxhighlight> property to use an image instead of a color/gradient:
 +
 +
<syntaxhighlight>
 +
div{
 +
    background-image: url('/image.png');
 +
}
 +
</syntaxhighlight>

Revision as of 11:06, 23 December 2022

Background

You can use the

background

CSS property to modify the background of an element. The background consists of several parts.

Background Color

The

background-color

property modifies the color of the background. For example, the code

div{ background-color: red; }

will create the following:

Background Image

You can use the

background-image

property to use an image instead of a color/gradient:

div{
    background-image: url('/image.png');
}