How to add a Background Image that scales with the Browser Window |Using CSS


To make the background image scale with the browser window we need to use the Background size property with value of cover like so,

CSS Code:

<style>
     html{
       background-image: url(my_background.jpg);
       background-repeat: no-repeat;
       background-position: center center;
       background-attachment: fixed;
       -webkit-background-size: cover;
       -moz-background-size: cover;
       -o-background-size: cover;
       background-size: cover;
       color: #fff;
       background-color: #000;
        }
<style>

Comments

Popular posts from this blog

How CSS3 Works