How do I use css background-repeat property?

hoodedvul

Also see: How do I use css background image property?

The background-repeat can repeat an image across the entire width and height, disable repeating, or repeat vertically or horizontally.

HTML Used.

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

CSS code used.

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

The result is:

Adding background-repeat: no-repeat; to the CSS disables repeating of the image and the result is:

Using background-repeat: repeat-x; or background-repeat: repeat-y; the images will be repeated horizontally or vertically.