Image is not loading from my system using css

Question

Hi i am trying to load image from my system using css but localhost says "The requested resource () is not available". If i use the image link from other sites it's working.

(I am using css from css folder)

My code is:

Html:

 <div id="trans">
 Some text
 </div>

css:

#trans {
     width: 180px;
     height: 180px;
     display: block;
     position: relative;
     border: 1px solid #000;
     margin: 20px auto;
     padding: 10px;
       }

#trans:after {
     background: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/owl1.jpg);/*If i am using local host path image is not loading*/
     opacity: 0.25;
     width: 200px;
     height: 200px;
     top: 0;
     left: 0;
     position: absolute;
     z-index: -1;
     content: "";
     }

image path in my system : C:\Users\some\Documents\NetBeansProjects\someone\web\images\trans.jpg

Answer 1

Your image path needs to be relative to the localhost, or the page you're currently on. I'm guessing it will be something like url(/images/trans.jpg) or url(../images/trans.jpg). Web browsers are not permitted to directly access the file system.