Can someone explain what "background: url(images/bg.jpg) no-repeat center center;" is doing?

Question

I've been using this method

http://css-tricks.com/perfect-full-page-background-image/

With this as my css for the div.

    mydiv {
            background: url(images/bg.jpg) no-repeat center center; 
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
    }

I don't understand what this part is. Which css properties is it filling in?

    center center; 

Can anyone enlighten me?

Answer 1

You will understand it better, if you split your background properties into:

background-image:url('images/bg.jpg');
background-repeat:no-repeat;
background-position:center center;

Answer 2

no-repeat means the background image will display once.

center center

means that the image will be centered both vertically and horizontally.