Обзавёлся и я форумом на phpbb 3.1.2 Правда, пока тестовый он, но после всех тестов обязательно конвертирую основной форум под новую версию И перед сменой версии хочу перекрасить стандартный prosilver для phpbb 3.1.2, чтобы потом залить его и и сделать его основным стилем. Как правильно заменить те белые полосы сверху, снизу и по бокам на свои картинки? По углам хочется разместить небольшие изображения, а далее повторяющиеся. Вот что хочется изменить:
Комментарии: 22
Если использовать для всех углов свои картинки, то надо будет добавлять пару блоков.
Два блока есть:
Добавляем свой класс к первому блоку и уже исходя из этого класса делаем фон. Например. Первый блок можно использовать для фона и левого и правого граней. Второй для верхнего и нижнего.
Могу так, на коленке, приблизительно расписать. Допустим мы дописали класс
Значения по месту, само собой...
Остаются только углы, тут нужны дополнительные блоки, по аналогии с http://cabinetadmina.ru/viewtopic.php?p=67547#p67547
Обозвать их только как нибудь по другому, например
Получается так, что мы не затрагиваем основной код, те классы которые уже есть и могут использоваться и в других местах, где всё может выглядеть не так или оно там будет не к месту.
Два блока есть:
Код: Выделить всё
<div id="p{postrow.POST_ID}" class="post has-profile и тд...
<div class="inner">
Могу так, на коленке, приблизительно расписать. Допустим мы дописали класс
post-bg
:
Код: Выделить всё
.post .post-bg {
position: relative;
background: url("./images/post-bg.png") repeat 0 0; /* Основной цвет */
}
/* Право и лево */
.post-bg:before, .post-bg:after {
content: "";
position: absolute;
height: 100%;
width: 25px;
top: 0;
}
.post-bg:before {
left: -5px;
background: url("./images/post-bg-left.png") repeat-y 0 0;
}
.post-bg:after {
right: -5px;
background: url("./images/post-bg-right.png") repeat-y 0 0;
}
/* Верх и низ */
.post-bg .inner:before, .post-bg .inner:after {
content: "";
position: absolute;
height: 25px;
width: 100%;
left: 0;
}
.post-bg .inner:before {
top: 0px;
background: url("./images/post-bg-top.png") repeat-x 0 0;
}
.post-bg .inner:after {
bottom: 0px;
background: url("./images/post-bg-bottom.png") repeat-x 0 0;
}
Остаются только углы, тут нужны дополнительные блоки, по аналогии с http://cabinetadmina.ru/viewtopic.php?p=67547#p67547
Обозвать их только как нибудь по другому, например
<div class="post-top"></div>
и <div class="post-bottom"></div>
Получается так, что мы не затрагиваем основной код, те классы которые уже есть и могут использоваться и в других местах, где всё может выглядеть не так или оно там будет не к месту.
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!
А фон опросов то почему?
А чтобы картинки не заползали:
можно отступы побольше сделать.
Добавить параметр
!important
к фону:
Код: Выделить всё
background: url("./images/post-bg.png") repeat 0 0 !important;
Код: Выделить всё
.post {
padding: 5px 10px;
...
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!
Это просто эксперименты провожу, как оно там отображаться будет
Да что-то не клеится оно, фон всё равно не отобразился ни в одном браузере. И при длинных сообщениях нижние картинки текст закрывают. Тоже во всех браузерах так. А попробовал все уголки и стороны убрать и оставить только фоновую картинку, то вместо моей картинки фоновым изображением стала картинка "В сети" Моя не воспринимается почему-то.
А имя картинки верное? Или тип?
Может быть потому что ты экспериментируешь с кодом в начале стиля. Как браузер строит картинку на мониторе? Он открывает последний из указанных стилевых файлов и начинает его читать снизу вверх, потом открывает тот, что стоит перед ним и всё повторяется снова, пока не кончатся стилевые файлы.
Например:
Код: Выделить всё
.block {
background-color: #000;
color: #FFF;
}
.block {
background-color: #FFF;
color: #000;
}
Поломать эту зависимость можно если добавить в путь дополнительный класс, либо параметр
!important
.Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!
Код: Выделить всё
<div id="p{postrow.POST_ID}" class="post has-profile <!-- IF postrow.S_ROW_COUNT is odd -->bg1<!-- ELSE -->bg2<!-- ENDIF --><!-- IF postrow.S_UNREAD_POST --> unreadpost<!-- ENDIF --><!-- IF postrow.S_POST_REPORTED --> reported<!-- ENDIF --><!-- IF postrow.S_POST_DELETED --> deleted<!-- ENDIF --><!-- IF postrow.S_ONLINE and not postrow.S_POST_HIDDEN --> online<!-- ENDIF --><!-- IF postrow.POSTER_WARNINGS --> warned<!-- ENDIF -->">
Код: Выделить всё
<!-- IF postrow.S_ROW_COUNT is odd -->bg1<!-- ELSE -->bg2<!-- ENDIF -->
Код: Выделить всё
.bg1 {
background-color: #ECF3F7;
}
.bg2 {
background-color: #e1ebf2;
}
Код: Выделить всё
.online {
background-image: url("./en/icon_user_online.gif");
}
background-image
заменить на background
, то основные цвета фона из bg1
и bg2
не будут добавляться.В принципе, раз фон меняется и чередование цветов не предусматривается, то
Код: Выделить всё
<!-- IF postrow.S_ROW_COUNT is odd -->bg1<!-- ELSE -->bg2<!-- ENDIF -->
Код: Выделить всё
<!-- IF postrow.S_ONLINE and not postrow.S_POST_HIDDEN --> online<!-- ENDIF -->
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!
Похожие темы
-
Здравствуйте.
Подскажите, в prosilver максимально какого размера можно поставить шрифт, чтобы было адаптивно? -
Здравствуйте.
Нужен простой ббкод для вставки youtube. Искал на просторах все не рабочие может у кого есть в наличии поделитесь пожалуйста.
Версия... -
Расширение позволяющее добавить рекламу на форум phpBB.
Расширение можно скачать на официальном сайте phpbb -
Расширение с правками от...