Search code examples
htmlcssimagenginxweb

nginx cant show the image in html

I am new to working with "Nginx" and I want to display an image as the website background but the image does not show and I get a 403 error for the image.

index.html:

<!DOCTYPE html>
<html>
    <head>
        <title>Hello</title>
        <meta charset="UTF-8">
        <link rel="stylesheet" href="./styles.css">
        <meta http-equiv="refresh"content="10">
    </head>
    <body>
        Nothing
    </body>
</html>

styles.css:

body {
    background-color:   rgb(29, 49, 53);
    background-image:   url(F.png);
}

nginx.conf:

http{
    include mime.types;
    server{
        listen 80;
        root /home/user/mysite;
        location /404.jpeg {}
        location /502.jpeg {}
        location /503.jpeg {}
        location /F.png{}
    }
}

events{}

here is the HTML file:

enter image description here

but in Nginx!:

enter image description here

and here is the logs of Nginx:

enter image description here

I want to display an image as the background of HTML file in Nginx

Solution

  • ok, I found the problem!!! somehow we must make the image file executable using the bellow command then Nginx can serve it correctly.

    chmod 755 F.png

    I hope it will be useful for others too.