css background-image: url(''); can’t find my image’s local path

Asked

Viewed 417 times

-1

  1. I am using Ubuntu
  2. I put (Ctrl + v) the image I want on the input screen (desktop)
  3. I open the terminal (Ctrl + alt + t)
  4. On the terminal, do: ls (image does not appear)
  5. I then do: Desktop cd
  6. Now I see the image file name, let’s assume it is: Woods.png
  7. I do: pwd
  8. The return of my terminal is: /home/my-user/Desktop
  9. I copy that feedback and concatenate with: /Woods.png
  10. I go into css, and try to use the image

Code

    
        body {
            height: 100%;
            width: 100%;
            /*background-image: url('/static/images/woods.png');*/
            background-image: url('/home/meu-user/Desktop/woods.png');
            background-attachment: fixed;
            background-position: bottom;
            background-size: cover;
        }
  1. In Django, the image opened normally, using the path specified above (commented)
  2. The same doesn’t happen when I try the image locally, even using its exact location
  3. What am I doing wrong?
css3 background-image

  • The image is . png even? tried to take that first / image walk? Leaves alone home/meu-user/Desktop/woods.png

  • Yes, it is in her settings, and yes, I have also tried to remove /, but there is some syntax error which I am unable to identify :(

  • First of all, can’t you put this image in your project directory? It’s already bad practice to try to access data outside the project...

  • I already have the configuration of Django (it is commented in the code). I wanted to know two ways to do, among them, pulling out of the project folder. It works on Windows, but I can’t get any form on Ubuntu. In short, that’s it.

  • What is the directory path of your project (pwd)? So I can improve my response so it fits better with your scenario.

1 answer

4

When using /home/meu-user/Desktop/woods.png, he’s actually searching the sub-folder /home/meu-user/Desktop/woods.png of your project.

Suppose your project directory is /home/meu-user/projeto, in which case he would be seeking the image in:

/home/meu-user/projeto/home/meu-user/Desktop/woods.png

Which is different from:

/home/meu-user/Desktop

So just fill in the following way:

../Desktop/woods.png

Directory architecture used as an example:

raiz (/) ----- home ------ meu-user ------- projeto
                                   \
                                    \------ Desktop ----- woods.png

Note: When using a software and its default system directory /var/www, for security reasons your application has access restriction to other directories as /home.

  • Thank you so much for your tip, it makes a lot of sense. I tried .. /Desktop/Woods.png just like I tried /var/www/Desktop/Woods.png and it didn’t take effect. What a sad thing :(but thank you very much.

Browser other questions tagged css3 background-image

You are not signed in. Login or sign up in order to post.