2

У меня не хочет грузиться фоновая картинка. В инете есть несколько вариантов:

BODY {
background-image: url(img/bg.jpg);
background-color: #c7b39b;
}

И второй вариант:

p {
    background-color: white;
    color: black;
    background-image: url('/img/pushkin.gif');
 }

Я испробовал два - не работают. Если фоновый рисунок находится в одной папке с style.css и написав background-image: url(pushkin.gif); - все работает.

Может, дело в каталогах?

/lib/

    /css/

    /img/

P.S. файл *.css подключен, все работает кроме графики.

4 ответа 4

9

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

p {
 background-color: white;
 color: black;
 background-image: url('../img/pushkin.gif');
}

Путь означает что нужно подняться в родительский каталог, зайти в папку img и найти файл pushkin.gif.

9
  • Не работает. Ставил одну точку, две и три - по нулям...((( 22 сен 2011 в 20:08
  • Извиняюсь - работает. Забыл lib убрать... Суппер... Большое спасибо 22 сен 2011 в 20:10
  • А если надо на два каталога подняться? 22 сен 2011 в 20:18
  • 1
    супер?О_о перенесите html файл и этот стиль уже не будет работать, если вам это неважно то тогда конечно - вперед, но лично я всегда все url'ы (как в css так и вообще где угодно) прописываю от корня чтобы рассположение html страницы никаким образом не влияло на работу css..<br>Ну да не суть, на вкус и цвет фломастеры разные...
    – user3545
    22 сен 2011 в 20:19
  • Если нужно на два каталога, тогда "../../"
    – DmitryBLR
    22 сен 2011 в 20:24
2

Если структура каталогов такая как вы указали, то нужно писать путь к картинке относительно расположения файла css, что в данном случае вот так:

background-image: url('../img/bg.jpg');

И всегда, ВСЕГДА, когда задаете какой-то фон картинкой, нужно указывать размеры изображения. (т.е. width и height)

4
  • Можно поинтерисоватся - зачем?О_о
    – user3545
    22 сен 2011 в 20:03
  • А вы попробуйте не задать и сами увидите эту порнографию ;) Хотя в случае с body картинка будет, но абы как. Вообще картинки на фон ставятся зачастую в пустые блоки и если не указать размеры - блока не будет видно.
    – metazet
    22 сен 2011 в 20:05
  • Согласен - это лишнее задавать размеры. 22 сен 2011 в 20:06
  • У меня стоит background-repeat : repeat-x; Иногда задаю команды отцентрировать. Картинка то имеет размеры - вот она и ставится в свои размеры например в центр... 22 сен 2011 в 20:21
1

Для установки фоновой картинки:

body {
    background:url('./img/bg.jpg');
    background-color: #c7b39b;
}

Не background-image, а просто background:url.

10
  • Не background-image,а просто background:url.<br> ЛОЛ а разница? xD
    – user3545
    22 сен 2011 в 20:20
  • Заменил на background:url (ради интереса) - не работает 22 сен 2011 в 20:23
  • Мой вариант рабочий 100%, если вы не смогли понять, как его правильно применить, то извините :) А фоновую картинку можно и так, и так задавать...
    – user3545
    22 сен 2011 в 20:24
  • background:url - универсальный,и работает везде.Не спорю разницы,почти нет,но хочу заметить этот код тоже работает.
    – zvlex
    22 сен 2011 в 20:37
  • Надо написать background:url(/lib/img/img.gif); или background:url('/lib/img/img.gif'); Хотя испробовал оба варианта - не работатет. Печально.((( 22 сен 2011 в 20:39
0

если у вас картинки хранятся в /lib/img/ То так и пишите background:url(/lib/img/img.gif)

"/" в начале означает корень сайта

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.