Chrome сообщает «Неверное значение свойства» для изображения

Question

В HTML-документе я написал базовый класс изображений

<div class = "upper-img"></div>

В моем CSS-файле класс просто определяется как

.upper-img {
    width: 360px;
    height: 250px;
    background: url(C:\siteImages\alaskanMountains.jpg);
}

. Я определил путьправильно, и изображение действительно отображается правильно в теге HTML.Тем не менее, я получаю сообщение об ошибке браузера Chrome, говорящее «недопустимое значение свойства.Вот изображение для справки:

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

Например, пара других вопросов была решена путем изменения

background-image: url("file")

на

background: url("file")

Это явно не сработало для меня, какие-либо идеи?

Answer 1

Во-первых, рекомендуется избегать пробелов при назначении класса для объекта HTML, то есть:

<div class = "upper-img"></div>

должно быть:

<div class="upper-img"></div>

---

Для фона, вы должны использовать относительный путь изображения.Если изображение находится в той же папке вашего встроенного CSS, вы можете просто вызвать изображение.Если он находится в другой папке, вам нужно перейти с помощью:

.. /, чтобы вернуться на один уровень папки./ перейти далее на один уровень папки.

IE:

background: url(../img/alaskanMountains.jpg);

Answer 2

Косые черты в пределах правила background должны быть впереди, а не назад.Кроме того, убедитесь, что вы не оставляете пробелы между атрибутами, знаком равенства и значением атрибута:

<div class="upper-img"></div>