URL-адрес фонового изображения CSS

Привет Im пытается использовать фон для моей страницы с помощью CSS. Изображение из другой папки, и я пытаюсь ссылаться на нее в файле CSS.

URL файла CSS:/var/www/soFit / BO

URL файла изображения:/var/www/soFit/BO/images / login

мой файл CSS:

#login-bg   
{

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

мой 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>

почему я не могу увидеть свое фоновое изображение?

10
background css html image

3 ответов

удалите ведущую косую черту из URL-адреса изображения следующим образом:

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

используя переднюю косую черту, браузер пытается загрузить изображение из корневого каталога веб-домена (e.g /var/www/) вместо текущего местоположения файла (CSS).

17

попробуйте это:

#login-bg   
{

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

использование косой черты ' / ' в начале маршрута делает его абсолютным маршрутом, а не относительным маршрутом, который вы хотите.

6

просто писать 

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

когда вы пишете / изображения, это означает, что папка изображений поступает из корневого каталога веб-сайта. что в данном случае неверно.

1