Пытаемся создать дизайн из, по сути, одной-единственной фоновой картинки
http://xmages.net/storage/10/1/0/c/b/up … 7735bd.png
Можно ли (и если да, то как) разбить изображение на три части: шапка, фон и низ; первая и третий прокручиваются, второй остается на месте и все это выглядит одним целым? Или же, как вариант, форум прокручивается в четко фиксированной рамке, все остальное же стоит на месте.
Скомпонированный дизайн
Страница: 1
Сообщений 1 страница 3 из 3
Поделиться1Пн, 8 Авг 2011 13:50:03
- Заслуженный
- Зарегистрирован: Вс, 15 Авг 2010
- Сообщений: 51
- Уважение: +6
- Позитив: +9
- Пол: Женский
- Последний визит:
Вт, 22 Янв 2013 22:18:02
Поделиться2Пн, 8 Авг 2011 13:59:09
- Тутошний...
- Зарегистрирован: Ср, 16 Июн 2010
- Сообщений: 51115
- Уважение: +15197
- Позитив: +11572
- Последний визит:
Сегодня 01:57:02
Саймон Сделайте скрин любого форума( достаточно длинный и лучше на однотонной подложке
Вот прога для снятия длинных скринов > http://desksoft.ru/index.php?forum=7&th=291
и вклейте В Фш(удалив прежний фон со скриншота) - как должно выглядет в итоге
поскольку серый нижний лист наклонен - идея с прокруткой вместе с фоновой - пролетает мимо( она проходит если Вы можете бесконечно растянуть фоновую картинку начиная от некого интервала от верха,
Отредактировано Deff (Пн, 8 Авг 2011 14:01:18)
Поделиться3Вт, 9 Авг 2011 03:51:43
- Стремясь к новому...
- Зарегистрирован: Вс, 12 Окт 2008
- Сообщений: 22652
- Уважение: +4738
- Позитив: +3431
- Пол: Мужской
- Предупреждения: ‡ 1. 2. 3. ... 10!
- Последний визит:
Вс, 14 Мар 2021 21:42:57
Саймон
Здравствуйте.
Вот Вам пример для ХТМЛ-верх, думаю, разберётесь, что к чему:
Код:
<style type="text/css">
html {
background-image: url(http://ximages.net/images/28323357105376677045.jpg);
background-position: center top;
background-repeat: repeat-y;
background-color: #999e88;
}
body {
background-image: url(http://ximages.net/images/77497907966625513048.jpg);
background-position: center top;
background-repeat: no-repeat !important;
padding-top: 540px !important;
}
#pun_wrap {
background: transparent url(http://ximages.net/images/98028268814275929859.jpg) no-repeat bottom center !important;
padding-bottom: 145px !important;
}
#pun {
margin: 0 auto;
width: 900px;
}
</style>Страница: 1