Фон не работает для div, как это должно быть
У меня странная проблема с путями, этот работает (на Windows):
<div style="background:url('folder1/image.gif')...
Но это не сработает (изображение не появляется):
<div style="background:url('/folder1/image.gif')...
Тем не менее эта страница говорит прямо противоположное (не первая, а вторая версия должна работать): фон не работает для div
Кто-нибудь знает, в чем может быть причина?
4 ответа:
Первый url-адрес относится к папке на сервере, в которой ваш HTML используется для отображения страницы.
Пример, если вы получаете:
www.mywebsite.com/index.htmlОн будет смотреть в: (Пример 2)
www.mywebsite.com/folder1/image.gifНо если вы находитесь в другой папке, например:
www.mywebsite.com/subfolder/index.htmlОн будет выглядеть следующим образом:
www.mywebsite.com/subfolder/folder1/image.gifЕсли вы используете '/' в beggin, путь не является более относительным, он всегда выглядит в корневом веб-сайте, как exemple 2, независимо от того, где находится ваш html.
Зависит от того, где находится ваше изображение и html-файл.
'folder1/image.gif'будет выполнен поиск папки 1, расположенной в том же пути, что и ваш html-файл (относительный путь).
'/folder1/image.gif'будет искать папку 1, начиная с базового местоположения вашего сервера (абсолютный путь).
Первый-относительный путь, второй-абсолютный путь
Относительные пути показывают путь к файлу из вызывающего контекста. Итак, если ваш html-файл / source / website / test.html, относительный путь
css/test.cssбудет указывать на файл в/source/website/css/test.cssАбсолютные пути показывают отношение ко всему пути, поэтому
/css/test.cssпытается найти файл в местоположении/css/test.css
Большинство современных браузеров позволяют просматривать элементы на веб-странице. В chrome (или другом современном браузере) откройте консоль и найдите ошибки, если url изображения неверен, консоль укажет его как ошибку, кроме того, вы получите значок сломанного изображения, если вы указали неправильный url
