web-dev-qa-db-fra.com

Chemin URL de l'image d'arrière-plan CSS

Bonjour, j'essaie d'utiliser l'arrière-plan de ma page en utilisant CSS. L'image provient d'un autre dossier et j'essaie de la référencer au fichier CSS.

L'URL du fichier CSS est:/var/www/soFit/BO

L'URL du fichier image est:/var/www/soFit/BO/images/login

Mon fichier CSS:

#login-bg   
{

    background-image:url('/images/login/login_background.jpg');
    font-size: 20px;
}

Mon code HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<link rel="stylesheet" type="text/css" href="styles.css" />

</head>

<body id="login-bg"> 

<form action="" method="POST">

Username:  <input type="text" name="username" > 
<br>
Password:  <input type="text" name="password" > 
<br>
<input type="submit" value="enter"> 

</form>

</body>
</html>

Pourquoi je ne peux pas voir mon image d'arrière-plan?

htmlcssimagebackground
10
dasdasd

Supprimez la barre oblique avant de l'URL de l'image, comme suit:

#login-bg {
    background-image:url('images/login/login_background.jpg');
    font-size: 20px;
}

En utilisant la barre oblique principale, le navigateur essaie de charger l'image à partir du répertoire racine Web du domaine (par exemple /var/www/) au lieu de l'emplacement actuel du fichier (CSS).

17
Mimi

Essaye ça:

#login-bg   
{

    background-image:url('images/login/login_background.jpg');
    font-size: 20px;
}

L'utilisation de la barre oblique "/" au début de l'itinéraire en fait un itinéraire absolu, pas un itinéraire relatif, ce que vous voulez.

6
Hoijof

ecrivez

background-image:url('images/login/login_background.jpg');

lorsque vous écrivez/images, cela signifie que le dossier images provient du répertoire racine du site Web. qui dans ce cas n'est pas correct.

1
Alex