Единый форум поддержки

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Единый форум поддержки » Архив » Общие вопросы по оформлению (51)


Общие вопросы по оформлению (51)

Сообщений 161 страница 180 из 997

1

Инструменты для поиска и редактирования стиля (скриптов).

Как с помощью браузера можно определить элемент дизайна.

Каталог скриптов/CSS

Полезные скрипты, необходимые темы для новичков, а также ссылки на сайты рассказывающие что такое НТМЛ и CSS.

Типовые Вопросы (ЧаВо)

Ответы на часто задаваемые вопросы.

Как задавать вопросы! Разница между стилем и скриптом. ( Советы)

Плюс к названию темы еще и Памятка.

Любой вопрос по оформлению/неполадкам сопровождайте ссылкой на форум, по которому возникли сложности.

Отредактировано Fover (Чт, 31 Окт 2013 05:16:27)

0

161

Катарина, добавьте красным

/* D3.2 */
#pun-navlinks .container {
   padding: 0.7em 1em;
   text-align: center;
   margin-top: -147px;
   }

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

Катарина написал(а):

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

Я дал вам ссылки на тексты с целью, чтобы вы в общем и целом охватили в воображении структуру того, с чем вы сейчас имеете дело. Это не попунктная раскладка каждого элемента, это объяснение, что существуют стандартные элементы, уже заложенные в систему, но можно и придумывать собственные в случае, если существующих не достаточно. Чтобы определить - самостоятельно, -  какой элемент отвечает за логотип, нужно "прощупать" элементы, присутствующие на странице. Для этого можете воспользоваться встроенными инструментами для разработчика, которыми оснащены все современные браузеры. О них вкратце (о том, как до них добраться в каждом из браузеров и коротко - как воспользоваться) написано здесь

+1

162

Deff
На самом деле хочется поле минипрофиля еще уже, чтобы места для сообщения было чуть больше. А ширину авика можно проконтролировать... Как и длину инфы в профиле.
Проставил, кажется.

0

163

Frisch-fritz написал(а):

Deff На самом деле хочется поле минипрофиля еще уже,

Типовые Вопросы п.п.30

0

164

Deff
Спасибо  http://mybb.ru/f/collection/0224.gif

0

165

Remus John Lupin написал(а):

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

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

Remus John Lupin написал(а):

Я дал вам ссылки на тексты с целью, чтобы вы в общем и целом охватили в воображении структуру того, с чем вы сейчас имеете дело. Это не попунктная раскладка каждого элемента, это объяснение, что существуют стандартные элементы, уже заложенные в систему, но можно и придумывать собственные в случае, если существующих не достаточно. Чтобы определить - самостоятельно, -  какой элемент отвечает за логотип, нужно "прощупать" элементы, присутствующие на странице. Для этого можете воспользоваться встроенными инструментами для разработчика, которыми оснащены все современные браузеры. О них вкратце (о том, как до них добраться в каждом из браузеров и коротко - как воспользоваться) написано здесь

слава богу кое что я понимаю, но цсс всё же остаётся загадкой для меня... Именно поэтому иду на готовое скажем так, в любом случае спасибо за подсказки!

0

166

Помогите наити скрипт своя картинка заднего фона форума облазила все  не нашла видимо пропустила гдето

0

167

Катарина, вы цифру-то можете сами корректировать, как вам нужно :-)

#pun-navlinks .container {
    padding: 0.7em 1em;
    text-align: center;
    margin-top: -155px;
}

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

/* D4.2 */
#pun-ulinks .container {
    border-top: medium none;
    padding: 0.7em 1em;
    text-align: center;
    margin-top: -10px;
}

И поменять им цвет:

#pun-ulinks li a {
    color: #e12;
}

Синим - шифр кода нужного вам цвета. Выбирайте в палитре тот, что вам подходит, и заменяйте выделенные цифры на тот код, что соответствует удовлетворяющему вас цвету.

+1

168

kolista, добавьте себе в профиль - Вебсайт адрес форума, с которым работаете и по которому задаете вопросы. Ну не дело ползать по всей теме в поисках и надежде, что вы где-то когда-то кому-то уже приводили ссылку на форум.

Для постановки заднего фона никакой скрипт не нужен. Это несложная операция производится средствами CSS во вкладке Администрирование - Свой стиль - Цвета стиля. Там у вас есть (или нужно прописать) селектор body и присвоить ему бекграунд.

Итого, с вам на постоянной основе - ссылку на форум себе в профиль здесь на ЕТП, и одноразово - ссылку на картинку, которую вам нужно установить в качестве фона.

0

169

Remus John Lupin
ой... Вы мой ангел хранитель, как же мне вас отблагодарить?  http://mybb.ru/f/collection/0211.gif
Спасибо огромное!

0

170

Катарина, пожалуйста :-) Рад помочь :-)

+1

171

К сожалению с каждым моим шагом я снова и снова нахожу проблемы в построении дизайна, и вот следующие два:
1- это конечно не особо важная проблема, но вё же....
та чёрточка, которая разделяет сообщение от подписи пользователя, я было её удленила, так как стандартный размер 250, в форуме всё хорошо, но в сообщениях она выходит за рамки
http://keepme.ru/images/2013/11/16/Immagine.png

2. картинки в категориях...
к сожалению этот скрипт ( Скрипты от пользователей 1 ) ставит картинки в пределах форума, а мои выходят за тело форума... попробовала сама добавить ширину, но безрезультатно :(

http://nothingelse.mybb.ru/

0

172

Катарина написал(а):

1- это конечно не особо важная проблема, но вё же....
та чёрточка, которая разделяет сообщение от подписи пользователя, я было её удленила, так как стандартный размер 250, в форуме всё хорошо, но в сообщениях она выходит за рамки

Задайте в процентном соотношении:

.punbb .post-sig dt {
display: block;
border-top: 1px solid #0f0f1e;
width: 100%;
margin: 5px 0;
}

Вместо: width: 700px;

+1

173

Катарина
Добавьте красным

<script type="text/javascript"><!--Своя картинка в каждую категорию -->
$(document).ready(function(){
myarray=new Array(
"CHAPTER I. CONTENTS", "http://keepme.ru/images/2013/11/16/contest.png",
"CHAPTER II. PROLOGUE", "http://keepme.ru/images/2013/11/16/prologue.png",
"CHAPTER III. EXPOSITION", "http://keepme.ru/images/2013/11/16/exposition.png",
"CHAPTER IV. EPILOGUE", "http://keepme.ru/images/2013/11/16/epilogue.png",
"CHAPTER V. POST SCRIPTUM", "http://keepme.ru/images/2013/11/16/post.png",
"CHAPTER VI. THE END", "http://keepme.ru/images/2013/11/16/end.png",
"Статистика форума", "http://keepme.ru/images/2013/11/16/статистика.png"    //Последний элемент без запятой! 
)
        $("#pun-index div.category h2,#pun-index #pun-stats h2").each(function (i) {
for(q=0;q<myarray.length;q++){
var cssObj = {
  "margin-left":"-33px",
  "width":"840px",

  "height":"140px",
  "background-color": "transparent",
  "background-image":"url("+myarray[q+1]+")",
  "background-position":"50% 50%",
  "background-repeat":"no-repeat"       //Последний элемент без запятой!
}
        if($(this).children("span").text()==myarray[q])$(this).css(cssObj);
        q++}
    });
});
</script>

Отредактировано Deff (Сб, 16 Ноя 2013 02:00:28)

+1

174

kolobdur74
Deff
всё встало на свои места, огрооомное спасибо!

0

175

Ещё вопрос.
Помогите с оформлением блока цитаты.
Сам не могу разобраться.
Вот исходник. Только он для форума phpBB3

Код:
blockquote {
   font-size: 0.95em;
   margin: 0em 1px 0 5px;
   overflow: hidden;
   color:#1E1B0F;
   font-family: georgia;
   font-style: italic;
   min-height: 35px;
   padding: 20px;
   background: none;
   border: 0;
}
blockquote div {
   margin-top: -5px;
   border: 1px solid #DFB95C;
   background: url("путь до файла/spback.png") bottom left repeat-x #FFFFE8;
   padding: 20px 20px 5px 30px;
   position: relative;
}
blockquote div:before {
   content: '';
   position: absolute;
   background: url("путь до файла/openq.png") top left no-repeat transparent;
   width: 16px;
   height: 16px;
   top: 23px;
   left: 5px;
}
blockquote div:after {
   content: '';
   position: absolute;
   background: url("путь до файла/closeq.png") top left no-repeat transparent;
   width: 16px;
   height: 16px;
   right: 5px;
   bottom: 5px;
}
blockquote div cite {
   font-style: normal;
   font-weight: bold;
   display: block;
   font-size: 0.9em;
   color: #fff;
   background: url("путь до файла/qhm.png") top left repeat-x transparent;
   height: 32px;
   line-height: 24px;
   position: absolute;
   top: -14px;
   text-shadow: #000000 1px 1px;
   left: -1px;
}
blockquote div cite:before {
   content: '';
   position: absolute;
   background: url("путь до файла/qho.png") no-repeat 0px 0px transparent;
   width: 31px;
   height: 39px;
   left: -31px;
   top: 0px;
}
blockquote div cite:after {
   content: '';
   background: url("путь до файла/qhc.png") no-repeat 0px 0px transparent;
   position: absolute;
   right: -10px;
   width: 10px;
   height: 32px;
}
blockquote.uncited div {
   padding: 10px 20px 5px 30px;
}
blockquote.uncited div:before {
   top: 15px;
}

Вот картинки к исходнику

spback
http://s7.uploads.ru/239i0.png

qho
http://s7.uploads.ru/uetRp.png

qhm
http://s6.uploads.ru/EQn1i.png

qhc
http://s6.uploads.ru/j0Qm3.png

openq
http://s7.uploads.ru/ucRkP.png

closeq
http://s7.uploads.ru/gnWik.png

Вот так должен выглядеть.

http://s7.uploads.ru/cYMka.jpg

0

176

Good
Левый край ботинка на <cite> http://s7.uploads.ru/uetRp.png - плохо прочищен, лишнюю тень несмытости даёт

Свернутый текст

<style type="text/css">

.punbb .quote-box {
   position: relative;
   font-size: 0.95em;
   margin: 0em 1px 0 5px;
   overflow: hidden;
   color:#1E1B0F;
   font-family: georgia;
   font-style: italic;
   min-height: 35px;
   padding: 20px;
   background: none #FFF7C6;
   border: 0;
}
.punbb .quote-box blockquote{
   margin-top: 5px;
   border: 1px solid #DFB95C;
   background: url("http://s7.uploads.ru/239i0.png") bottom left repeat-x #FFFFE8;
   padding: 20px 20px 5px 30px;
   max-width:93%;
   position: relative;
}
.punbb .quote-box blockquote:before {
   content: '';
   margin-top: -5px;
   background: url("http://s7.uploads.ru/ucRkP.png") top left no-repeat transparent;
   position: absolute;
   width: 16px;
   height: 16px;
   top: 23px;
   left: 5px;
}
.punbb .quote-box blockquote:after {
   content: '';
   position: absolute;
   z-index:100;
   background: url("http://s7.uploads.ru/gnWik.png") top left no-repeat transparent;
   width: 16px;
   height: 16px;
   right: 5px;
   bottom: 5px;
}
.punbb .quote-box cite {
   font-style: normal;
   font-weight: bold;
   display: block;
   font-size: 0.9em;
   color: #fff;
   background: url("http://s6.uploads.ru/EQn1i.png") top left repeat-x transparent;
   height: 32px;
   line-height: 24px;
   position: absolute;
   z-index:100;
   top: 4px;
   text-shadow: #000000 2px 2px;
   left: 14px;
}
.punbb .quote-box cite:before {
   content: '';
   position: absolute;
   z-index:-1;
   background: url("http://s7.uploads.ru/uetRp.png") no-repeat 0px 0px transparent;
   width: 31px;
   height: 39px;
   left: -13px;
   top: -0px;
}
.punbb .quote-box cite:after {
   content: '';
   background: url("http://s6.uploads.ru/j0Qm3.png") no-repeat 0px 0px transparent;
   position: absolute;
   right: -10px;
   width: 10px;
   height: 32px;
}
blockquote.uncited div {
   padding: 10px 20px 5px 30px;
}
blockquote.uncited div:before {
   top: 15px;
}
</style>

http://s6.uploads.ru/0DQhO.png

Отредактировано Deff (Сб, 16 Ноя 2013 12:26:19)

+1

177

Deff, не много не то.
Цитата получилась на фоне старой цитаты, стандартной
Надо вот так

http://s7.uploads.ru/t/sV5iz.jpg

Добавлено спустя 7 минут 15 секунд:

Не надо, сам подправил))

Отредактировано Good (Сб, 16 Ноя 2013 14:49:59)

0

178

Здраствуйте, Мне 10 лет. Я создала свой форум по КВ. Я как ни стараюсь в HTML разобраться не могу. Помогите кто нибудь с "шапкой" иконками и т.д.
Заранее Спасибо.

0

179

Мятнолистая, Данная Просилка: К Администратору сервиса

Создайте свою отдельную тему - поможем
Выложите там ссылку на Ваш форум с опусами и  ссылку на Шапку.
Можно начать в данной теме: Общие вопросы по оформлению (51)

0

180

Deff, спасай.
Цитату докрутил. Ссылка на пост с цитатой
Но теперь и спойлер изменился. Поле под текстом в спойлере приняло облик цитаты.
До этого спойлер был таким КЛАЦ
Стал таким КЛАЦ

Скрипт спойлера

Код:
<!-- спойлер -->
<style type="text/css"> 
.punbb .quote-box.spoiler-box {
background-color:#fff;
border:dotted 1px #d0b857;
-moz-border-radius:5px;
-khtml-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
padding:10px 5px 14px 10px;
}
.punbb .spoiler-box blockquotes {
min-width:100%;
}
#button-spoiler {
background:url('http://forumstatic.ru/files/0013/0b/24/10341.png') no-repeat center !important;
}
.post-content .spoiler-box > blockquotes.visible,.post-content .spoiler-box span.hide {
display:none;
}
</style>
<script type="text/javascript">
function tag_spolierr(){
var enterTITLE = prompt("Введите описание закрытой кнопки", 'Спойлер');
var enterTITLE2 = prompt("Введите описание открытой кнопки", 'Закрыть');
bbcode('[spoiler='+enterTITLE+'|'+enterTITLE2+']','[/spoiler]');
}
var image_Spl="<img width=\"34\" src=\"http://forumstatic.ru/files/0013/0b/24/80208.png\" class=\"Sp-button\" onclick=\"$(this).parents('div.spoiler').children('div.show-hide').toggle('slow'),$(this).parents('div.spoiler').find('span.show-hide').toggle()\" onmousedown=\"this.src='http://forumstatic.ru/files/0013/0b/24/80208.png'\" onmouseup=\"this.src='http://s5.uploads.ru/IlOJu.png'\" onmouseout=\"this.src='http://forumstatic.ru/files/0013/0b/24/80208.png'\" style=\"margin:-8px 6px 0 -28px;float:left;\" alt=\"'Кнопка'\"/>";
$(document).ready(function() {a='<img onclick="tag_spolierr()" title="Скрыть в спойлер" src="/i/blank.gif"/>'
$("#form-buttons td#button-spoiler img").replaceWith(a);
$(".post-box .quote-box.spoiler-box div[onclick*='toggleClass']").each(function() {
  $(this).html($(this).html().replace(/(.*)?\|(.*)?/img,'<span class="visible">$1</span><span class="hide">$2</span>'))
  $(this).prepend(image_Spl)
});
$(".post-box .quote-box.spoiler-box div[onclick*='toggleClass']").click(function(){
  $(this).next('blockquotes').toggle('Slow');
  $(this).find('span:eq(0),span:eq(1)').toggleClass('hide').toggleClass('visible');
 });
});
</script>
<!-- окончание спойлера-->

А это коды на цитату

Код:
<style type="text/css">
.punbb .post-content .quote-box {
background:none;
border:0!important;
position:relative;
overflow:hidden;
min-height:35px!important;
margin:10px 0;
padding:10px 0 10px 5px;
}

.punbb .quote-box p {
font-size:16px;
line-height:18px;
color:#504536;
font-family:Georgia;
font-style:italic;
}

.punbb .quote-box blockquote {
margin-top:5px;
margin-left:6px;
-moz-border-radius:8px;
-khtml-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
border:solid 1px #B38000;
background-color:#FCFCCE;
max-width:91%;
position:relative;
padding:13px 20px 0 22px;
}

.punbb .quote-box blockquote:before {
content:'';
background:url(http://s6.uploads.ru/4aiNC.png) top left no-repeat transparent;
position:absolute;
width:15px;
height:13px;
top:17px;
left:3px;
}

.punbb .quote-box blockquote:after {
content:'';
position:absolute;
z-index:100;
background:url(http://s7.uploads.ru/4gLWP.png) top left no-repeat transparent;
width:15px;
height:13px;
right:4px;
bottom:4px;
}

.punbb .quote-box cite {
font-style:normal;
font-weight:700;
display:block;
font-size:13px;
color:#fff;
background:url(http://s6.uploads.ru/EQn1i.png) top left repeat-x transparent;
height:32px;
line-height:24px;
position:absolute;
z-index:100;
top:0;
text-shadow:#000 2px 2px;
left:13px;
}

.punbb .quote-box cite:before {
content:'';
position:absolute;
z-index:-1;
background:url(http://s7.uploads.ru/CWe76.png) no-repeat 0 0 transparent;
width:31px;
height:38px!important;
left:-13px;
top:0;
}

.punbb .quote-box cite:after {
content:'';
background:url(http://s6.uploads.ru/j0Qm3.png) no-repeat 0 0 transparent;
position:absolute;
right:-10px;
width:10px;
height:32px;
}
</style>

Что то где то надо поменять что бы серекторы разные были, а что не знаю

Могу дать ник и пароль от тесового

Отредактировано Good (Сб, 16 Ноя 2013 19:40:00)

0


Вы здесь » Единый форум поддержки » Архив » Общие вопросы по оформлению (51)