Background Images

CSS Tutorial

The background-image property defines an image that can be used as the background of an element.

The image is set to repeat, so it covers the entire element by default.

				
					<h1>Hello World!</h1>
<p>This page has an image as the background!</p>

				
					body {
  background-image: url("nature.gif");
}

Output

The background image can also be used for specific elements, like the <p> element:

				
					<h1>Hello World!</h1>
<p>This text is not easy to read on this background image.</p>

				
					p {
  background-image: url("bgset.jpg");
}

Output