Я хочу вот такой диз - http://i064.radikal.ru/1005/32/e1bcc2223dc9.jpg
Но как его сделать не знаю. Помогите пожалуста!
Помогите с дизом!
Сообщений 1 страница 20 из 29
Поделиться2Пт, 19 Ноя 2010 19:21:41
- Заслуженный
- Зарегистрирован: Вт, 3 Мар 2009
- Сообщений: 372
- Уважение: +64
- Позитив: +112
- Пол: Женский
- Последний визит:
Пн, 18 Апр 2011 19:04:35
1) делаем и ставим фон (стандарт)
2) делаем и ставим лого (стандарт)
3) делаем полупрозрачную картинку посветлее и ставим ее фоном в ксс в цвета туда, где вы раньше прописывали цвет основного форума.
4) делаем полупрозрачную картинку потемнее и ставим ее фоном в структуру ксс (А 5.1)
+ там же прописываем границы форума
в остальных местах ее убираем
Отредактировано Karamel'ka (Пт, 19 Ноя 2010 19:24:16)
Поделиться3Пт, 19 Ноя 2010 19:24:39
Эээээ...я ничего не поняла...можете мне код дать? Я честно ничего не поняла...
Поделиться4Пт, 19 Ноя 2010 19:25:48
Вот мой адрес: http://cwcat.9bb.ru/
Поделиться5Пт, 19 Ноя 2010 21:34:21
- Стремясь к новому...
- Зарегистрирован: Вс, 12 Окт 2008
- Сообщений: 22652
- Уважение: +4738
- Позитив: +3431
- Пол: Мужской
- Предупреждения: ‡ 1. 2. 3. ... 10!
- Последний визит:
Вс, 14 Мар 2021 21:42:57
AngelWolf написал(а):
Я хочу вот такой диз - http://i064.radikal.ru/1005/32/e1bcc2223dc9.jpg Но как его сделать не знаю. Помогите пожалуста!
Вам потребуются три изображения. Одно из них будет главным фоном форума, другое окажется под фоновыми таблицами, третье будет логотипом. При этом всё это вставляется кодом, который нужно просто установить к Вам в ХТМЛ-верх, предварительно заполнив своими даными:
<style type="text/css">
body {
background: url(Адрес изображения для основного фона) top center;
}#pun {
background: url(Адрес изображения для фона под форумом) repeat-y top center;
}#pun-title table {
background: url(Адрес изображения логотипа) no-repeat top center;
height: 250px;
}
</style>
Выделенное красным число - это высота изображения для логотипа. Укажите своё значение. Не забывайте, что логотип по ширине должен совпадать с шириной форума.
Отредактировано rps (Пт, 19 Ноя 2010 21:35:13)
Поделиться6Пт, 19 Ноя 2010 22:24:58
Спасибо, только как получить изображения? Я в фотошопе плохо понимаю(((
Поделиться7Пт, 19 Ноя 2010 22:37:39
- Стремясь к новому...
- Зарегистрирован: Вс, 12 Окт 2008
- Сообщений: 22652
- Уважение: +4738
- Позитив: +3431
- Пол: Мужской
- Предупреждения: ‡ 1. 2. 3. ... 10!
- Последний визит:
Вс, 14 Мар 2021 21:42:57
AngelWolf написал(а):
Я в фотошопе плохо понимаю(((
Тогда пусть Дефф нарисует. Или обратитесь на форумы, специализирующиеся по Фотошопу.
Поделиться8Пт, 19 Ноя 2010 22:44:34
- Cтарожил
- Зарегистрирован: Вт, 5 Дек 2006
- Сообщений: 2682
- Уважение: +359
- Позитив: +174
- Пол: Мужской
- Последний визит:
Сб, 1 Июл 2023 10:21:01
AngelWolf написал(а):
Я хочу вот такой диз - http://i064.radikal.ru/1005/32/e1bcc2223dc9.jpg
А я хочу вот такую машину - http://i064.radikal.ru/1005/32/e1bcc2223dc9.jpg
Поделиться9Сб, 20 Ноя 2010 00:50:17
- Заслуженный
- Зарегистрирован: Вт, 3 Мар 2009
- Сообщений: 372
- Уважение: +64
- Позитив: +112
- Пол: Женский
- Последний визит:
Пн, 18 Апр 2011 19:04:35
rps написал(а):
Вам потребуются три изображения. Одно из них будет главным фоном форума, другое окажется под фоновыми таблицами, третье будет логотипом.
почему три-то??? четыре должно быть..
лого, фон, сама таблица форума и pun с отступом в пикселей 10, наверное..
AngelWolf написал(а):
Я в фотошопе плохо понимаю(((
ууу..
вот с этого и надо было начинать..
собирайте исходники на лого, фон и пишите в личку
Поделиться10Сб, 20 Ноя 2010 00:55:31
- Стремясь к новому...
- Зарегистрирован: Вс, 12 Окт 2008
- Сообщений: 22652
- Уважение: +4738
- Позитив: +3431
- Пол: Мужской
- Предупреждения: ‡ 1. 2. 3. ... 10!
- Последний визит:
Вс, 14 Мар 2021 21:42:57
Karamel'ka
Потому, что три. И не учите меня в том, в чём я уверен и знаю это лучше Вас.
Отредактировано rps (Сб, 20 Ноя 2010 00:55:40)
Поделиться11Сб, 20 Ноя 2010 01:12:44
- Заслуженный
- Зарегистрирован: Вт, 3 Мар 2009
- Сообщений: 372
- Уважение: +64
- Позитив: +112
- Пол: Женский
- Последний визит:
Пн, 18 Апр 2011 19:04:35
rps написал(а):
Потому, что три. И не учите меня в том, в чём я уверен и знаю это лучше Вас.
да я вас не учу..
просто как полоска сзади может быть темнее, чем pun?
если там две одинаковые полупрозрачные картинки, то пун по определению должен быть светлее
невозможно же вставить пнг на обводку, тем более там и так белая стоит о_О
Отредактировано Karamel'ka (Сб, 20 Ноя 2010 01:15:13)
Поделиться12Сб, 20 Ноя 2010 01:14:10
- Cтарожил
- Зарегистрирован: Вт, 5 Дек 2006
- Сообщений: 2682
- Уважение: +359
- Позитив: +174
- Пол: Мужской
- Последний визит:
Сб, 1 Июл 2023 10:21:01
rps написал(а):
И не учите меня в том, в чём я уверен и знаю это лучше Вас.
Поделиться13Сб, 20 Ноя 2010 01:27:20
- Стремясь к новому...
- Зарегистрирован: Вс, 12 Окт 2008
- Сообщений: 22652
- Уважение: +4738
- Позитив: +3431
- Пол: Мужской
- Предупреждения: ‡ 1. 2. 3. ... 10!
- Последний визит:
Вс, 14 Мар 2021 21:42:57
Karamel'ka написал(а):
просто как полоска сзади может быть темнее, чем pun?
Там достаточно трёх изображений. И если Вы берётесь помогать, то должны знать это.
1. Основной фон форума. Он по идее должен представлять из себя небольшое бесшовное изображение, чтобы им можно было замостить.
2. Фон для #pun. Он должен быть примерно такой: http://s11.radikal.ru/i184/1011/d2/10a971b3ed8d.png. При этом не обязательно создавать прозрачность, так как к примеру ИЕ6 не будет поддерживать её, а его доля достаточно велика - получится не кроссбраузерно. Поэтому я бы в середине этого фона просто нанёс ту же текстуру (или как там это правильно называется, я не в ладах с терминами Фотошопа), что и на основном фоне. И размножил его вертикально по центру. Получилось бы как раз то, что изображено на скриншоте.
Не сказал, что этот фон тоже бесшовный.
3. Ну и логотип тоже, как отдельное изображение.
Отредактировано rps (Сб, 20 Ноя 2010 01:28:39)
Поделиться14Сб, 20 Ноя 2010 01:41:38
- Заслуженный
- Зарегистрирован: Вт, 3 Мар 2009
- Сообщений: 372
- Уважение: +64
- Позитив: +112
- Пол: Женский
- Последний визит:
Пн, 18 Апр 2011 19:04:35
rps написал(а):
ИЕ6 не будет поддерживать её,
полупрозрачную пнг картинку о_О
а в принципе, та же сама корова получается) только смотрим с разных сторон))
Поделиться15Сб, 20 Ноя 2010 01:44:50
- Стремясь к новому...
- Зарегистрирован: Вс, 12 Окт 2008
- Сообщений: 22652
- Уважение: +4738
- Позитив: +3431
- Пол: Мужской
- Предупреждения: ‡ 1. 2. 3. ... 10!
- Последний визит:
Вс, 14 Мар 2021 21:42:57
Karamel'ka
Да. Пользователи этого браузера не увидят прозрачных .png изображений. Можно конечно ухитряться и добиваться такого эффекта, но я считаю, что это нелогично в даной ситуации, большие "навороты" окажутся излишними, когда можн сократить как код, так и вес графики и предложить в конечном итоге кроссбраузерное решение.
Если хотите - нарисуйте это всё, я соберу и покажу, как оно выглядит.
Поделиться16Сб, 20 Ноя 2010 14:23:06
- Заслуженный
- Зарегистрирован: Вт, 3 Мар 2009
- Сообщений: 372
- Уважение: +64
- Позитив: +112
- Пол: Женский
- Последний визит:
Пн, 18 Апр 2011 19:04:35
Поделиться17Сб, 20 Ноя 2010 14:43:01
- Стремясь к новому...
- Зарегистрирован: Вс, 12 Окт 2008
- Сообщений: 22652
- Уважение: +4738
- Позитив: +3431
- Пол: Мужской
- Предупреждения: ‡ 1. 2. 3. ... 10!
- Последний визит:
Вс, 14 Мар 2021 21:42:57
Karamel'ka написал(а):
ну, ие всегда в своем репертуаре =(
А что Вы хотите от браузера (ИЕ6), которому 11 лет практически? Когда его создавали, ничего этого не было в столь широком распространении, как сейчас.
Пересядьте на Оперу 1, будет примерно то же самое.
Сейчас попробую собрать.
Поделиться18Сб, 20 Ноя 2010 16:40:51
- Стремясь к новому...
- Зарегистрирован: Вс, 12 Окт 2008
- Сообщений: 22652
- Уважение: +4738
- Позитив: +3431
- Пол: Мужской
- Предупреждения: ‡ 1. 2. 3. ... 10!
- Последний визит:
Вс, 14 Мар 2021 21:42:57
Karamel'ka
Пришлось самому переправлять так, как я хотел увидеть... В Пейнте... Грубо, но как сумел, да это и не важно.
Код:
<style type="text/css">
body {
background: #cbd3e8 url(/uploads/0003/83/96/1754-2-f.jpg) repeat fixed;
}
#pun {
width: 800px;
margin: 0 auto;
background: transparent url(/uploads/0003/83/96/1754-1-f.jpg) repeat fixed;
border-width: 0 2px;
border-style: solid !important;
border-color: #42636c;
}
.punbb {
margin: 0 auto;
width: 98%;
float: none;
}
#pun-title table {
background: url(http://savepic.net/273802.png) no-repeat top center;
height: 400px;
}
</style>Во-первых, в идеале я бы сделал оба фона 30 на 30 пикселов или около того, тем меньше, чем позволит рисунок на них. Это бы позволило существенно сократить загрузку, так как в сумме они бы дали не более 10 Кб.
Во-вторых, замостив основной фон и фон #pun я бы добился того, что форум одинакого выглядел бы на всех разрешениях и во всех браузерах. Даже те, кто сидят на браузерах конца прошлого века, вроде ИЕ 6 или ранее, увидели бы форум так же, как и остальные, ибо здесь не нужно обрабатывать полупрозрачные .png каналы, достаточно лишь подставить в фон два маленьких изображения, нарисовать рамку сбоку... Ну и ширину обозначить.
В третьих, если бы вместо зелёной рамки сбоку я бы захотел сделать бортик, второе изображение можно было бы сделать, как и предлагал ранее тонким и длинным и замостить им вертикально.
Старайтесь всегда сокращать вес графических материалов! Потому, что не у всех широкополосный Интернет, не все смогут позволить быстро загрузить Вашу страницу. Нормальный стиль должен весить порядка 50 - 60 Кб, всё, что более 100 Кб нужно в обязательном порядке переделать. Это очень много.
Отредактировано rps (Сб, 20 Ноя 2010 17:02:57)
Поделиться19Сб, 20 Ноя 2010 20:56:09
- Заслуженный
- Зарегистрирован: Вт, 3 Мар 2009
- Сообщений: 372
- Уважение: +64
- Позитив: +112
- Пол: Женский
- Последний визит:
Пн, 18 Апр 2011 19:04:35
rps написал(а):
http://tps.bbmy.ru/
не, все клово..
но.. где второй пнг?? который в фоне был??
весь вопрос же в нем был..
то, что там два полупрозрачных слоя
rps написал(а):
В третьих, если бы вместо зелёной рамки сбоку я бы захотел сделать бортик, второе изображение можно было бы сделать,
так суть того диза в том, что там 2 наложенных полупрозрачных слоя.
все было б замечательно, но мы говорим про конкретный диз
rps написал(а):
прошлого века, вроде ИЕ 6 или ранее
если все время на них оглядываться, то и надо делать диз прошлого века
ресурс развивается, это круто (ц)
rps написал(а):
второе изображение можно было бы сделать, как и предлагал ранее тонким и длинным и замостить им вертикально.
это зависит от фона, точнее от отсутствия стуков на нем
rps написал(а):
Это очень много.
смотря на какую аудиторию нацелено
Поделиться20Сб, 20 Ноя 2010 20:59:12
- Стремясь к новому...
- Зарегистрирован: Вс, 12 Окт 2008
- Сообщений: 22652
- Уважение: +4738
- Позитив: +3431
- Пол: Мужской
- Предупреждения: ‡ 1. 2. 3. ... 10!
- Последний визит:
Вс, 14 Мар 2021 21:42:57
Karamel'ka написал(а):
но.. где второй пнг?? который в фоне был??весь вопрос же в нем был..то, что там два полупрозрачных слоя
Нет, там нет никаких двух полупрозрачных слоёв. Вы вообще где их увидели?
Karamel'ka написал(а):
так суть того диза в том, что там 2 наложенных полупрозрачных слоя.все было б замечательно, но мы говорим про конкретный диз
Суть того зизайна я воспроизвёл, с незначительными отклонениями (без бордюра).