CSS Hack – Background image fit

 Code

Background image fit

1 2 3 4 5 6

body {     background-image:    url(images/mybackground.svg);     background-size:     cover;                      /* <------ */     background-repeat:   no-repeat;     background-position: center center;              /* optional, center the image */ }

Background image cover

1 2 3 4 5 6 7

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

Background image size

1 2 3 4 5 6 7 8 9 10 11

.example1 {   background: url(bg.jpg);   background-repeat: no-repeat;   background-size: auto; }   #example2 {   background: url(bg1.jpg);   background-repeat: no-repeat;   background-size: 300px 100px; }

Cover full image

1 2 3 4 5

body {   background-position: center;   background-repeat: no-repeat;   background-size: cover; }