Перейти к публикации
View in the app

A better way to browse. Learn more.

Дизайн и модификация Invision Community

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Создание скинов ipb для чайников (меняем css)

Опубликовано:

В этой теме попробую по-русски описать значение и возможности классов css (каскадный стиль) в ipb. Их много, поэтому описывать буду постепенно и с перерывами.

Рекомендованные сообщения

Опубликовано:

какие классы отвечают за вкладки в профайле? и можно ли туда вставить картинки?

Опубликовано:
  • Автор
какие классы отвечают за вкладки в профайле? и можно ли туда вставить картинки?

А точнее?

Какие именно вкладки?

Если можно, приведите пример из профиля с url хотя бы на этом форуме.

Опубликовано:

все понятно что ничего не понятно))) вернулся к нулевому варианту и решил начать с верхней картинки. если я использую ее как фон и пишу в классе ipbwrapper, то она не раздвигается на весь экран, а занимает установленный width. (у меня он 92%) а если вставлять картинку через тег в HTML шаблон, то вставляется нормально и занимает всю площадь, но сразу же и таблицы раздвигаются на полную, хотя я width в классах не трогаю...

 

так разобрался потихоньку, добавил класс ipbwrapper2, вписал его в HTML. в свойствах класса первого ширину поставил 100 а второго 92 - получилось)))

 

прем дальше

Изменено пользователем KEFIROFFU4

Опубликовано:

подогнал центральную картинку, но она все равно вылезает из \-за сабменю и активюзерс - поставлю черный фон.

добавил ipbwrapper3 (после закрытия двух первых div) и вставил третью картинку - нижнюю, но почему то она вставляется не целиком а только нижний ее край.

вот что получилось

форум, CSS, HTML

 

это надо как то исправить)))

пока пойду дальше

Опубликовано:
  • Автор

Для начала осознайте, что центральная картинка ну никак не может не вылезать, поскольку она в самом нижнем слое - body, на который все накладывается с собственными параметрами, никак от фона не зависящими.

Картинку огромной по высоте сделали, а про то, что шапка короткая, забыли.

В css увеличьте высоту в классе #logostrip. Она по дефолту 68px, а фоновая картинка явно больше...

Опубликовано:
А точнее?

Какие именно вкладки?

Если можно, приведите пример из профиля с url хотя бы на этом форуме.

ну по середине вкладке при просмотре профиля. "Темы", "сообещния" "блог" и тд...

 

я туда хочу снег сверху добавить)

Опубликовано:

порезал margin у всех ipbwrapper и все стало на свои места.

submenu и userlinks залил черным, но - как изменить цвет сылок в userlinks?

в submenu всу поменялось без проблем а в юзерлинкс меняется цвет текста (Вошли как...) а цвет ссылок остается прежним

Опубликовано:
  • Автор
ну по середине вкладке при просмотре профиля. "Темы", "сообещния" "блог" и тд...

 

я туда хочу снег сверху добавить)

Если снег в полосу заголовка всех вкладок, это:

.pp-tabclear,
.pp-maintitle

А выше расположены кнопки.

Достаточно править

.pp-tabon

А также

.pp-taboff,

.pp-tabshaded

 

порезал margin у всех ipbwrapper и все стало на свои места.

submenu и userlinks залил черным, но - как изменить цвет сылок в userlinks?

в submenu всу поменялось без проблем а в юзерлинкс меняется цвет текста (Вошли как...) а цвет ссылок остается прежним

Ссылки в юзерлинках задаются общим классом со всеми ссылками форума практически

a:link,
a:visited,
a:active

Вначале сделайте скин, возможно, цвет ссылок править и не придется, когда поправите их все.

А иначе надо будет создавать дополнения к классу юзерлинков.

Опубликовано:

спасибо

Опубликовано:
А иначе надо будет создавать дополнения к классу юзерлинков.

раскажите как привильно синтаксически создать дополнение к классу userlinks?

Сейчас код выглядит так

#userlinks,
#userlinksguest{ 
margin: 0px 0 0px 0;
padding: 0 40px 0 40px;
clear: both;
	 background: #FFF;
	 color: #FFFF99;
}

#userlinksguest{ 

}

и еще

1. как использовать вместо стандартных ссылок в userlinks картинки, например готовые кнопки?

2. как редактировать ссылки submenu, userlinks - ну чтоб помимо обычных стандартных добавить какие нибудь свои? или удалить несколько ненужных стандартных.

3. какие еще параметры кроме border может иметь граница блоков? (ну например типы линии - двойная или прерывистая, или цвет линии)

 

P.S. Большое спасибо за своевременные ответы)) они очень помогают в освоении форумстроительства.

Опубликовано:

как изменить фон основных полей форума?

в maintitle получилось, а вот с subtitle не выходит, пишу transparent - 0 реакции, класы row1, row2 вообще не могу найти)

сейчас код выглядит так

а сам ворум так

Опубликовано:

с цветом ссылок в юзерлинкс разобрался сам) создал дополнительный класс

Опубликовано:
  • Автор

По порядку вопросы бы задавали...

Это не относится, кстати, к вопросам по css.

О сабменю. Как добавить новые ссылки форума - читайте.

 

Чтобы слова меню заменить кнопками, достаточно вместо Названий меню прописать картинки (кнопки) в тегах

 

Про css:

Обычная линия: solid; Двойная линия: double (yтолстить ее надо при этом минимум до 3px); прерывистая: dashed; точечная: dotted;

C цветами линий разберетесь сами.

Многие видимые линии в таблицах по дефолту задаются не контуром, а промежутком в таблицах - это тоже вопрос не по css, а html: cellspacing="1".

Опубликовано:

скрин

в каких HTML шаблонах настраиваются строка быстрого поиска, навигация внизу и выбор скина юзером? Можно ли настраивать их цветовую гамму в CSS? Можно ли их убрать совсем и как?

Опубликовано:
  • Автор

Можно.

Найдите в css заголовок

/* 
* ========================================
* form styles 
* ========================================
*/

Все, что ниже, касается оформления мелких форм ввода или скроллинг-списков.

Попробуйте отредактировать классы:

select

 

.textarea,

.searchinput

 

Убрать совсем в css нельзя, можно только убрать фон и контур.

Создайте аккаунт или войдите в него для комментирования

Сейчас на странице 0

  • Нет пользователей, просматривающих эту страницу.

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.