How do I use css background image property?

hoodedvul

HTML Used.

...
    <div>
        <h1>Good Morning HTML</h1>
    </div>
...

CSS code used.

...
 div {
           width: 500px;
           height: 500px;
           border: 5px solid blueviolet;
           margin: 100px auto;
}
...

The result is:

Let's add a background image to our div element. The background property background-image takes a URL value.

CSS code updated.

...
 div {
           width: 500px;
           height: 500px;
           border: 5px solid blueviolet;
           margin: 100px auto;
           color: #fff;
           background-image: url(images/rose.jpeg);
}
...

The result is:

To make the heading stand out we change the text color to white.