помогите с шапкой форума

В этом разделе вы сможете найти все для оформления вашего форума:
аватарки, иконки групп, медали (награды) для форума,
смайлы и многое другое.
Аватара пользователя
Uzanka

Re: помогите с шапкой форума

Uzanka 21 май 2014, 19:59 Сообщение

Спасибо большое! Всё получилось :Yahoo!: правда, пришлось шапку пока убрать. Надо картинку красивую придумать :oops: Та, что я хотела, не подошла. Надо новую нарисовать. Но идея понятна. Спасибо большое! :Rose:
Форум Science-Леди www.scienceclub.listbb.ru

Аватара пользователя
Uzanka

Re: помогите с шапкой форума

Uzanka 03 июл 2014, 00:37 Сообщение

Ребята, помогите с шапкой форума еще разок. Я сделала как-то, но меня не очень устраивает.

Шапка у меня резиновая. Залила ее цветом. Внутрь вставила картинку с девушкой. Картинка не очень большой ширины и поэтому оставалось много места слева и справа. Я сделала так, что она автоматически теперь 1) ставит картинку слева 2) остальное справа заполняет белым.

Вот так получилось:
Изображение

Но это не красиво. Хотелось бы, чтобы оставалось место справа и слева (цвета фона). В общем, я никак не могу понять как правильно это реализвать. Подбирать размер картинки под мою шапку и мой экран? А если будет другой размер, то как это будет выглядеть?

Помогите, пожалуйста :oops:

зы. чтобы было более понятно, что я хочу... вот что-то типа такого см. шапку этого форума (только бабочку не нужно)
Форум Science-Леди www.scienceclub.listbb.ru

Аватара пользователя
CabinetAdmin

Re: помогите с шапкой форума

CabinetAdmin 03 июл 2014, 14:18 Сообщение

Uzanka » Сегодня, 03:37 писал(а):А если будет другой размер, то как это будет выглядеть?

Вот в этом обычно и заключается загвоздка:)

Можно нарисовать ещё одну картинку, не очень широкую, и установить её по правому краю. Получится примерно такое:
ваше изображение / белая пустота / новое изображение

Получится что на широких мониторах будет видна вся шапка, а на тех что поуже новое изображение будет скрыто.

Делается это так. В хедере у вас есть такой кусок:

Код: Выделить всё

<div class="post bg3" style="background-color:white; width:1000px;">

меняете его на:

Код: Выделить всё

<div class="post bg3" style="background: url(new_image.png) no-repeat 600px 0 #FFF;width:1000px;">


600px - это отступ слева.
Создать форум бесплатно на http://luckbb.ru/
Хочешь поблагодарить? Есть способы Поддержать проект

Аватара пользователя
silver073000

Re: помогите с шапкой форума

silver073000 05 июл 2014, 01:21 Сообщение

CabinetAdmin » 03 июл 2014, 14:18 писал(а):Получится что на широких мониторах будет видна вся шапка, а на тех что поуже новое изображение будет скрыто.

А не получится так, что у кого-то на широком мониторе будет браузер не на весь экран развёрнут и будет видна часть второй картинки? :)

Аватара пользователя
CabinetAdmin

Re: помогите с шапкой форума

CabinetAdmin 05 июл 2014, 06:26 Сообщение

Может быть и такое. В этом смысле фиксированная ширина форума лучше.
Создать форум бесплатно на http://luckbb.ru/
Хочешь поблагодарить? Есть способы Поддержать проект

Аватара пользователя
Uzanka

Re: помогите с шапкой форума

Uzanka 05 июл 2014, 19:31 Сообщение

CabinetAdmin
спасибо. Я поняла. Подумаю как лучше сделать.
Форум Science-Леди www.scienceclub.listbb.ru

Аватара пользователя
Uzanka

Re: помогите с шапкой форума

Uzanka 06 июл 2014, 00:49 Сообщение

CabinetAdmin
не подскажете как бы мне разместить эту часть, обернутую в <div class="post bg3" style="background-color:white; width:120%;">, по середине шапки. Сейчас она смещена влево. А хочется немного сдвинуть ее от левого края. Вот так (красными стрелочками попыталась пояснить):
Изображение

Если честно, то я уже разные варианты пробовала. Ничего не работает :(
Форум Science-Леди www.scienceclub.listbb.ru

Аватара пользователя
CabinetAdmin

Re: помогите с шапкой форума

CabinetAdmin 06 июл 2014, 10:03 Сообщение

Замените:

Код: Выделить всё

<div class="post bg3" style="background-color:white; width:120%;">


на:

Код: Выделить всё

<div class="post bg3" style="background-color:white; clear: both;text-align: center;">


И в теме стиля добавьте к #site-description { - right: 0;
Создать форум бесплатно на http://luckbb.ru/
Хочешь поблагодарить? Есть способы Поддержать проект

Степ

Re: помогите с шапкой форума

Степ 31 авг 2014, 15:22 Сообщение

CabinetAdmin, здравствуйте. Вытачиваю другой стиль под себя. Возник вопрос. Подскажите, какой код отвечает за положение логотипа в шапке. Именно логотипа. Как можно сдвинуть его в разных направлениях? *нужно вверх чуть поднять, что бы выровнять, ну и для себя знать каким образом можно двигать в разные стороны логотип.
Стиль - сынок сабсильвера.
Спасибо.
Развернуть
Если хотите узнать глубину души человека, то плюньте ему в душу и считайте до тех пор,
пока не получите по морде.

Аватара пользователя
silver073000

Re: помогите с шапкой форума

silver073000 01 сен 2014, 01:41 Сообщение

Этот стиль? http://demo.phpbb3styles.net/X-Static
В overall_header.html этот участок кода отвечает за логотип

Код: Выделить всё

<td height="100" align="left" valign="middle" rowspan="2"><a href="{U_INDEX}">{SITE_LOGO_IMG}</a></td>

и плюс в теме

Код: Выделить всё

#top_logo { margin : 0 0 0 0; padding : 0 0 0 0; background : url('./images/top_header.png') repeat-x top right; height : 100px; border: 1px solid #4d6c95; /*border-left : 1px solid #404040; border-right : 1px solid #404040;*/ white-space : nowrap; overflow : hidden; }

можно попробовать поиграться со значениями margin и padding
Ну а вот тут

Код: Выделить всё

#logodesc { margin-bottom : 5px; padding : 5px 25px; background : #d9dfe4; border-bottom : 1px solid #4787a7; }

код margin-bottom : 5px; - это отступ до кнопок, что расположены под логотипом. А в padding : 5px 25px; 5 - это отступ от логотипа сверху и снизу. Если, например, установить значение 55, то над логотипом и под ним образуется пустое место в 55px :milo: То же самое и со значением 25, только это относится к боковым отступам :)

Аватара пользователя
romaamor

Re: помогите с шапкой форума

romaamor 04 сен 2014, 16:41 Сообщение

CabinetAdmin
А как правильно вставить дополнительные элементы в шапку форума для prosilver, в один ряд ? Как не пытаюсь всё сьезжает , ломается. В subsilver2 было проще, таблицей.

Аватара пользователя
CabinetAdmin

Re: помогите с шапкой форума

CabinetAdmin 04 сен 2014, 18:41 Сообщение

Ну, дык, таблицей и сделай.
Создать форум бесплатно на http://luckbb.ru/
Хочешь поблагодарить? Есть способы Поддержать проект

Аватара пользователя
romaamor

Re: помогите с шапкой форума

romaamor 04 сен 2014, 19:06 Сообщение

CabinetAdmin » 23 минуты назад писал(а):Ну, дык, таблицей и сделай.

Пробовал. Всё равно получается в два этажа вложения.

Аватара пользователя
silver073000

Re: помогите с шапкой форума

silver073000 04 сен 2014, 22:12 Сообщение

Если есть строка

Код: Выделить всё

<tr><td>содержимое ячейки</td><td>содержимое второй ячейки</td></tr>
то строку не должно переносить. Если в ячейке есть слова, то ячейка может сжиматься, перенося слова на новые строки. То же самое и с картинками, если таблица будет примерно с таким кодом

Код: Выделить всё

<table><tr><td>картинка картинка</td><td>картинка картинка</td></tr></table>
При низком разрешении монитора картинки могут стать одна под одной. То же самое и с элементами.

Аватара пользователя
romaamor

Re: помогите с шапкой форума

romaamor 04 сен 2014, 22:32 Сообщение

Пытался вставить картинку, скрипт, всё в приделах размеров шапки. Меня там дивы смущают. Не привык я ещё к просильверу. Вот как к примеру вставить между логом и поиском ещё один елемент что бы всё было в ряд ?

Код: Выделить всё

<div id="wrap"> <a id="top" name="top" accesskey="t"></a> <div id="page-header"> <div class="headerbar"> <div class="inner"><span class="corners-top"><span></span></span> <div id="site-description"> <a href="{U_INDEX}" title="{L_INDEX}"><img src="http://satelitray.ru/styles/prosilver/imageset/Black_and_white_on_transparent_background_312x75.png" /></a> <p class="skiplink"><a href="#start_here">{L_SKIP}</a></p> </div> <!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH --> <div id="search-box"> <form action="{U_SEARCH}" method="get" id="search"> <fieldset> <input name="keywords" id="keywords" type="text" maxlength="128" title="{L_SEARCH_KEYWORDS}" class="inputbox search" value="<!-- IF SEARCH_WORDS-->{SEARCH_WORDS}<!-- ELSE -->{L_SEARCH_MINI}<!-- ENDIF -->" onclick="if(this.value=='{LA_SEARCH_MINI}')this.value='';" onblur="if(this.value=='')this.value='{LA_SEARCH_MINI}';" /> <input class="button2" value="{L_SEARCH}" type="submit" /><br /> <a href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}">{L_SEARCH_ADV}</a> {S_SEARCH_HIDDEN_FIELDS} </fieldset> </form> </div> <!-- ENDIF --> <span class="clear"></span></div> </div>



Похожие темы

Вернуться в «Графика и дизайн»

Кто сейчас на конференции

Сейчас этот форум просматривают: нет зарегистрированных пользователей и 3 гостя