title: Get 404 not found for webp images on the website
body: <p>I am replacing the website's images from .jpg to .webp. The way I use is through modernizr to detect whether the browser can accept webp and then set the background-image. But, there's always errors for webp images. Is there anything I haven't set? or what can I do to solve this question?</p>
  
  <p>I already tried to change background-color and it worked.</p>
  
  <pre><code>&lt;script src="js/modernizr-custom.js"&gt;&lt;/script&gt;
  &lt;style type="text/css"&gt;
  .no-webp .bg {
      background-image: url('Image/img_Head02.jpg');
  }
  .webp .bg {
      background-image: url('Image/img_Head02.webp');
  }
  </code></pre>
  
  <p></p>
  
  <p>I expect that the images in webp type can show up on the website.
  But now, there's an error: GET <a href="http://test.poct-bio.com/JobW/Image/img_Head02.webp" rel="nofollow noreferrer">http://test.poct-bio.com/JobW/Image/img_Head02.webp</a> 404 (Not Found)</p>