Бек граунд в light header

Блог им. KaMaToZzz
Странно, подскажите, как правильно вставить картинку на задний фон в light header?
Пробовал через css, никаких изменений не увидел, а через html, тоже…
Подскажите пожалуйста!

UPD by x3r0x:

1. Редактируем файл header.light.tpl (в каталоге, котором лежит скин, например /templates/skin/new/), а именно меняем строку:

<body>

на

<body id="light_bg">


2. В каталог /templates/skin/new/images копируем изображение под именем bg.jpg

3. В файл /templates/skin/new/css/style.css добавляем строки:

#light_bg {
background: #f7f8f9 url(../images/back.jpg) no-repeat top left; background-size: 100% auto; -moz-background-size: 100% auto; background-origin: border;
}

20 комментариев

avatar
css кэшируется, поэтому после его изменения, надеюсь, кэш сбрасывали?
avatar
Вроде как да, вы про удаление файлов в cache и compiled?
Да удалял, но что-то не никаких изменений…
avatar
cache и compiled в папках вашего темплейта.

Возможно какой-то плагин подменяет header.tpl…

И кстати, про браузерный кэш тоже дельное замечание.
avatar
+1 и если можно то поподробней я тоже делал и чет не чего не вышло
avatar
не нашли решения?
avatar
нет наверно сам жду =)
avatar
Способ, который я проделал на версии 0.4.2:

1. Редактируем файл header.light.tpl (в каталоге, котором лежит скин, например /templates/skin/new/), а именно меняем строку:
<body>

на
<body id="light_bg">


2. В каталог /templates/skin/new/images копируем изображение под именем bg.jpg

3. В файл /templates/skin/new/css/style.css добавляем строки:
#light_bg {
	background: #f7f8f9 url(../images/bg.jpg) no-repeat top left;
}


4. Чистим кеши, смотрим результат

PS: браузеры любят кешировать css, так что скорей всего придется чистить и кеш браузера.
avatar
Отлично, все получилось!
А регулировать изображение по разрешению монитора это: wight: 100%px; hight: 100%;?
avatar
>100%px
>hight

почитайте учебничек по CSS :)
avatar
ой, я даже не знаю как Вас теперь и отблагодарить уважаемый.
avatar
не нужно благодарностей.
avatar
Уже все значения перепробовал auto 100% и прочее, ну не хочет картинка сжиматься под разрешение экрана… не подскажите?
avatar
Победила такая строка:

#light_bg {
background: #f7f8f9 url(../images/back.jpg) no-repeat top left; background-size: 100% auto; background-origin: border;
}
avatar
а как бы теперь, сделать меняющиеся картинки после преезагрузки странички?
avatar
JavaScript или в Smarty можно сделать.
Похоже вам очень хочется сделать копию лепры
avatar
Безумно!
Если честно, просто начал учить php, ну и паралельно пытаюсь что-то крутить/курить!
avatar
Без элементарных знаний html+css, вам в PHP делать нечего. Задумайтесь над расширением кругозора в вышеперечисленных языках.
avatar
Столкнулся с такой проблемой, в опере и хроме отображается нормально:
background сжимается под разрешение монитора, а в Mozila FF не растягивается, виден только край картинке, как быть?
avatar
а я думала это у меня руки растут не из того места.
))
Спасибо )
avatar
Для того, чтобы работало в мазиле, опере и хроме:

#light_bg {
background: #f7f8f9 url(../images/back.jpg) no-repeat top left; background-size: 100% auto; -moz-background-size: 100% auto; background-origin: border;
}
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.