Difference between revisions of "CSS: Backgrounds"
Academicteam (talk | contribs) (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');
}