title: how to blur the background image only in css
body: <p>Hi i am trying to blur the background image but i think its lacking in doing so. Any help over it will boost my energy for it. Thanks</p>
  
  <p>This my CSS</p>
  
  <pre><code>html {
    position: relative;
    min-height: 100%;
    max-width:  100%;
     background: url(img/rsz_1spring.jpg);
     background-repeat: no-repeat;
     -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
   max-width: 100%;
      overflow-x: hidden;
  
  }
  </code></pre>
  
  <p>I am  trying to apply this but it blur all my webpage instaed of background image only.</p>
  
  <pre><code>-webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -o-filter: blur(5px);
  -ms-filter: blur(5px);
  filter: blur(5px);
  </code></pre>
  
  <p>Thank you.</p>