CSS background-image не загружается

Question

У меня проблема с загрузкой моего фонового изображения в качестве живого веб-сайта (с использованием страниц github). Когда я загружаю его локально, я могу заставить его работать, введя полный каталог. Однако когда я перемещаю его в Github, каталог меняется, и он больше не работает. Подводя итог, когда я использую background-image url("images/picture.jpg");, он не будет работать вообще. Я должен набрать background-image url("c/onedrive/webroot/images/picture.jpg");, так что полное имя файла. Однако это не работает, когда положить на Github. Любая помощь приветствуется. (

Answer 1

Как уже упоминалось, это похоже на проблему с путем к файлу. При использовании относительных путей, таких как images/picture.jpg, убедитесь, что целевое изображение находится в правильном относительном местоположении, как указано. Если ваша папка images находится в проекте root, ваш URL фонового изображения был безопаснее / лучше был бы /images/picture.jpg с / в начале, чтобы обозначить проект root.

Обновление

Глядя на ваш код в репо, я исправил его, обновив относительный путь - background-image: url("../images/abstract.jpg");

Структура вашей папки выглядит как ...

/
|
├── css/
├── images/
├── js/ 
├── objects/
└── video/

Поскольку ваша таблица стилей в папке css указывает на файл в папке images, вам необходимо использовать правильный относительный путь.

Answer 2

Я сталкивался с этой проблемой раньше. Если у вас фоновое изображение не работает, проверьте, правильно ли указан ваш путь, вы также можете щелкнуть правой кнопкой мыши изображение в браузере файлов, открыть Свойства -> Безопасность и скопировать путь оттуда. Если это не работает, скопируйте адрес изображения прямо из браузера и вставьте его туда.

Answer 3

Проверьте правильность вашего пути

body {
 background-image: url("path_of_image_from_this_page.jpg");
}