Как указать фоновый рисунок в CSS?

Мой файл CSS находится в:

Project/Web/Поддержка/Стили/file.css

Мое изображение находится в:

Project/Web/изображения/image.png

Я хочу это изображение в моем файле CSS.

Я пробовал:

1) background-image: url(/images/image.png);
2) background-image: url('/images/image.png');
3) background-image: url("/images/image.png");
4) background-image: url(../images/image.png);
5) background-image: url('../images/image.png');
6) background-image: url("../images/image.png");

Но. Я не получаю это изображение на своей странице.

Каков правильный способ указать путь к файлу изображения в файле css?

Ответы

Ответ 1

Ваш css находится здесь: Project/Web/Support/Styles/file.css

1 раз ../ означает Project/Web/Support и 2 раза. /i.e. ../../ означает Project/Web

Try:

background-image: url('../../images/image.png');

Ответ 2

Существует два основных способа:

url(../../images/image.png)

или

url(/Web/images/image.png)

Я предпочитаю последнее, так как это упрощает работу и работает со всех мест на сайте (так полезно для встроенных путей изображения тоже).

Имейте в виду, я бы не сделал так много глубоких вложений в папки. Это кажется ненужным и делает жизнь немного сложной, как вы нашли.

Ответ 3

Используйте ниже.

background-image: url("././images/image.png");

Это будет работать.

Ответ 4

Вам нужно вернуть 2 папки из файла css.

Попытка:

background-image: url("../../images/image.png");

Ответ 5

Решение (http://expressjs.com/en/starter/static-files.html).

После этого папка с изображениями больше не будет помещена. только

background-image: url ( "/image.png" );

carpera, что изображение уже находится в статических файлах