[Ликбез]
Форма входа
Логин:
Пароль:
Меню сайта
Скрипты и коды для юкоз - Форум аццкого кодера » Как сделать... » Как повторить картинку на ширину экрана и зафиксировать?
Как повторить картинку на ширину экрана и зафиксировать?
[1] likbezz [12.12.2011, 02:47]
Q: MarkoniYA
Quote (MarkoniYA)
Здравствуйте. Не нашел где на форуме спросить.
Оформляю сайт к новому году. Нашел хорошее оформление. Но не могу сделать, что бы центральная картинка nycenter1.png повторялась на ширину экрана. repeat-x 100% не срабатывает. Потратил несколько часов, примостырил на сайте кривым кодом, но хотелось бы по уму.

У меня картинка должна висеть над сайтом и не прокручиваться вместе с остальным материалом.
[2] likbezz [12.12.2011, 02:51]
Code
<div style="background:url(http://likbezz.ru/_source/_img/2011/01/nycenter_bg.png) repeat-x left bottom;position:fixed;bottom:0;left:0;width:100%;">
<img border="0" style="margin-top:132px;float:left;width:208px;height:118px;" src="http://likbezz.ru/_source/_img/2011/01/nyleft.png" alt="" />
<img border="0" style="float:right;width:159px;height:250px;" src="http://likbezz.ru/_source/_img/2011/01/nyright.gif" alt="" />
</div>



...

☑ Пример ... (фиксированный блок снизу экрана) ...
...
Прикрепления: 3018544.png (32.7 Kb)
[3] Diana [31.01.2012, 11:01]
Красиво конечно - я ставила но быстро убрала.Картинка получается поверх сайта и закрывает комментарии и сообщения.Хоть и прозрачная а написать поверх неё ничего нельзя.По высоте ёлки ничего нельзя написать нигде.Как у тебя вверху шарик сделан что он писать не мешает и все ссылки поверх него? Можно ли сделать так же с этой картинкой?
[4] likbezz [31.01.2012, 15:05]
Diana,
Quote (Diana)
Как у тебя вверху шарик сделан что он писать не мешает и все ссылки поверх него? Можно ли сделать так же с этой картинкой?

Шапку упакована в блок с фоновой картинкой - фарик)
Тоже самое и с елкой можно сделать, но тогда она не будет фиксироваться, а просто будет внизу страницы.
...

Quote (Diana)
Можно ли сделать так же с этой картинкой?

Можно, но немного не так, а вот так:
Code
<div style="background:url(http://likbezz.ru/_source/_img/2011/01/nycenter_bg.png) repeat-x left bottom;left:0;width:100%;height:46px;position:fixed;bottom:0;left:0;">
<img border="0" style="display:block;position:fixed;bottom:0;left:0;float:left;width:208px;height:118px;" src="http://likbezz.ru/_source/_img/2011/01/nyleft.png" alt="" />
<img border="0" style="display:block;position:fixed;bottom:0;right:0;float:right;width:159px;height:250px;" src="http://likbezz.ru/_source/_img/2011/01/nyright.gif" alt="" />
</div>

...

☑ Пример v2 (фиксированный блок снизу экрана) ... ...
...
[5] Diana [01.02.2012, 22:18]
Просто замечательно.Спасибо biggrin
[6] foksin [17.12.2012, 14:19]
Прикольно получилось, только елочку убрала, а то сильно аляповато))))
[7] Diana [17.12.2012, 16:48]
foksin, Елочку можно заменить на маленькую или вообще на что угодно - только размер гифки поменяй в коде и всё.
У меня в прошлом году стояла маленькая елочка и вместо подарка домик с огоньками biggrin
[8] foksin [17.12.2012, 17:35]
Quote (Diana, Пн, 17.12.2012, 22:48:38)
Елочку можно заменить на маленькую или вообще на что угодно - только размер гифки поменяй в коде и всё.
У меня в прошлом году стояла маленькая елочка и вместо подарка домик с огоньками

Diana, да что то поищу, лишь бы код был, а он сейчас есть , я поставила хорошо смотрится у меня smile
Полная версия сайта