Изображения CSS работают с Браузером Live View в Chrome, но не в другом браузере

Question

У меня проблема с моим css. Все мои CSS работают во всех браузерах, за исключением того, что все изображения для фонов не загружаются. Как и мой файл значков, который на самом деле связан в заголовке HTML.

В текстовом редакторе в скобках в режиме просмотра в реальном времени (просмотр в реальном времени открывается только в Chrome). Я вижу значок и изображения, но в других сценариях, например при открытии html-файла в любом браузере, включая Chrome, ни одно из изображений не работает.

Я не очень понимаю, в чем заключается сделка, но первое предположение будет на пути, но я не думаю, что это так. Пример:

.container{ background-image: url("lib/css/img/cityscape.jpg"); }

Я пробовал одинарные и двойные кавычки, а не кавычки. Я попытался сократить относительный путь, и это тоже не сработало. Любые предложения о том, почему мои изображения работают только в режиме предварительного просмотра в текстовом редакторе скобок?

Спасибо.

Answer 1

Только что вернулся к работе над этим, но, похоже, проблема была в расположении пути в файле css.Это не было достаточно относительно, и, возможно, кто-то мог бы объяснить, почему это лучше, чем я.

/*This works by putting the period in front of the path*/
background-image: url('./img/banner.jpg');

/*What didn't work*/
background-image: url('lib/css/img/banner.jpg')

Точка называется точечным сегментом

Я нашел здесь некоторую информацию: Что означает точка в пути URL?

Однако мне все еще неясно, почему Live View в редакторе скобок позволяет мне видеть изображения.Я думаю, что это связано с тем, как работает live view, который размещает сайт локально на каком-то случайном порту, а не просто открывает файл из папки напрямую.

Надеюсь, это не проблемакогда его отправили на удаленный сервер.