FAQ по css IP.Board 2.x.x

Статус
В этой теме нельзя размещать новые ответы.

lena1

クリエイター
LV
0
 
<!--sizeo:4--><span style="font-size:14pt;line-height:100%"><!--/sizeo-->Как изменить шрифт форума?<!--sizec--></span><!--/sizec-->

<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->font-family: Verdana, Tahoma, Arial, "Trebuchet MS", Sans-Serif, Georgia, Courier, "Times New Roman", Serif;<!--c2--></div><!--ec2-->
В этой строке основным берётся текст семейства <b>Verdana</b>.
Первое семейство, указанное в свойстве <i>font-family</i> всегда является основным.

<!--sizeo:4--><span style="font-size:14pt;line-height:100%"><!--/sizeo-->Как изменить цвет текста форума?<!--sizec--></span><!--/sizec-->

<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->body{
&nbsp;&nbsp;&nbsp;&nbsp;background: #FFF;
&nbsp;&nbsp;&nbsp;&nbsp;color: #222;
&nbsp;&nbsp;&nbsp;&nbsp;font-family: Verdana, Tahoma, Arial, "Trebuchet MS", Sans-Serif, Georgia, Courier, "Times New Roman", Serif;
&nbsp;&nbsp;&nbsp;&nbsp;font-size: 11px;
&nbsp;&nbsp;&nbsp;&nbsp;line-height: 135%;
&nbsp;&nbsp;&nbsp;&nbsp;margin: 0px;
&nbsp;&nbsp;&nbsp;&nbsp;padding: 0px; /* required for Opera to have 0 margin */
&nbsp;&nbsp;&nbsp;&nbsp;text-align: center; /* centers board in MSIE */
}<!--c2--></div><!--ec2-->
<b>color: #222;</b> - это означает цвет текст.

<!--sizeo:4--><span style="font-size:14pt;line-height:100%"><!--/sizeo-->Как изменить стиль ссылок на форуме?<!--sizec--></span><!--/sizec-->

<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->a:link,
a:visited,
a:active{
&nbsp;&nbsp;&nbsp;&nbsp;background: transparent;
&nbsp;&nbsp;&nbsp;&nbsp;color: #222;
&nbsp;&nbsp;&nbsp;&nbsp;text-decoration: underline;
}

a:hover{
&nbsp;&nbsp;&nbsp;&nbsp;background: transparent;
&nbsp;&nbsp;&nbsp;&nbsp;color: #34498B;
}<!--c2--></div><!--ec2-->
Этот участок отвечает за стиль ссылок.

<!--sizeo:4--><span style="font-size:14pt;line-height:100%"><!--/sizeo-->Как сделать подчёркивание ссылок точками?<!--sizec--></span><!--/sizec-->

Нужно найти этот фрагмент:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->a:link,
a:visited,
a:active{
&nbsp;&nbsp;&nbsp;&nbsp;background: transparent;
&nbsp;&nbsp;&nbsp;&nbsp;color: #222;
&nbsp;&nbsp;&nbsp;&nbsp;text-decoration: underline;
}

a:hover{
&nbsp;&nbsp;&nbsp;&nbsp;background: transparent;
&nbsp;&nbsp;&nbsp;&nbsp;color: #34498B;
}<!--c2--></div><!--ec2-->
И заменить его этим:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->a:link,
a:visited,
a:active{
&nbsp;&nbsp;&nbsp;&nbsp;background: transparent;
&nbsp;&nbsp;&nbsp;&nbsp;color: #222;
&nbsp;&nbsp;&nbsp;&nbsp;text-decoration: none;
&nbsp;&nbsp;&nbsp;&nbsp;border-bottom: 1px dotted #222;
}

a:hover{
&nbsp;&nbsp;&nbsp;&nbsp;background: transparent;
&nbsp;&nbsp;&nbsp;&nbsp;color: #34498B;
}<!--c2--></div><!--ec2-->
<b>border-bottom: 1px dotted #222;</b> - отвечает за подчёркивание ссылок точками.

<!--sizeo:4--><span style="font-size:14pt;line-height:100%"><!--/sizeo-->Как изменить высоту логотипа?<!--sizec--></span><!--/sizec-->

<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->#logostrip{
&nbsp;&nbsp;&nbsp;&nbsp;background: #3860BB url(style_images/<#IMG_DIR#>/tile_back.gif);
&nbsp;&nbsp;&nbsp;&nbsp;border: 1px solid #FFF;
&nbsp;&nbsp;&nbsp;&nbsp;height: 68px;
&nbsp;&nbsp;&nbsp;&nbsp;margin: 0;
&nbsp;&nbsp;&nbsp;&nbsp;padding: 0;
}<!--c2--></div><!--ec2-->
Этот участок отвечает за логотип на форуме, а строка <b>height: 68px;</b> - за высоту этого логотипа.

<!--sizeo:4--><span style="font-size:14pt;line-height:100%"><!--/sizeo-->Как удалить поля, окружающие форум?<!--sizec--></span><!--/sizec-->

Нужно найти участок:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->.borderwrap,
.borderwrapm{ /* this will affect the outlining border of all the tables and boxes through-out the skin. */
&nbsp;&nbsp;&nbsp;&nbsp;background: #FFF;
&nbsp;&nbsp;&nbsp;&nbsp;border: 1px solid #072A66;
&nbsp;&nbsp;&nbsp;&nbsp;padding: 0px;
&nbsp;&nbsp;&nbsp;&nbsp;margin: 0px;
}<!--c2--></div><!--ec2-->
И заменить его на:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->.borderwrap,
.borderwrapm{ /* this will affect the outlining border of all the tables and boxes through-out the skin. */
&nbsp;&nbsp;&nbsp;&nbsp;background: #FFF;
&nbsp;&nbsp;&nbsp;&nbsp;border: 0;
&nbsp;&nbsp;&nbsp;&nbsp;padding: 0px;
&nbsp;&nbsp;&nbsp;&nbsp;margin: 0px;
}<!--c2--></div><!--ec2-->

<!--sizeo:4--><span style="font-size:14pt;line-height:100%"><!--/sizeo-->Как изменить цвет полей, окружающих форум?<!--sizec--></span><!--/sizec-->

<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->.borderwrap,
.borderwrapm{ /* this will affect the outlining border of all the tables and boxes through-out the skin. */
&nbsp;&nbsp;&nbsp;&nbsp;background: #FFF;
&nbsp;&nbsp;&nbsp;&nbsp;border: 1px solid #072A66;
&nbsp;&nbsp;&nbsp;&nbsp;padding: 0px;
&nbsp;&nbsp;&nbsp;&nbsp;margin: 0px;
}<!--c2--></div><!--ec2-->
Нужно изменить строку - <b>background: #FFF;</b>

<!--sizeo:4--><span style="font-size:14pt;line-height:100%"><!--/sizeo-->Как поместить фоновое изображение в сообщение?
Как поменять цвет бэкграунда сообщения?<!--sizec--></span><!--/sizec-->

Для этого нужно найти участок:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->.post1,
.bg1{
&nbsp;&nbsp;&nbsp;&nbsp;background: #F5F9FD;
}

.post2,
.bg3{
&nbsp;&nbsp;&nbsp;&nbsp;background: #EEF2F7;
}<!--c2--></div><!--ec2-->
И заменить его на:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->.post1,
.bg1{
&nbsp;&nbsp;&nbsp;&nbsp;background: #цвет url(style_images/<#IMG_DIR#>/bgpost.jpg) no-repeat;
}

.post2,
.bg3{
&nbsp;&nbsp;&nbsp;&nbsp;background: #цвет url(style_images/<#IMG_DIR#>/bgpost.jpg) no-repeat;
}<!--c2--></div><!--ec2-->
<b>#цвет</b> - цвет бэкграунда
<b>bgpost.jpg</b> - изображение, которое будет фоновым рисунком.

<!--sizeo:4--><span style="font-size:14pt;line-height:100%"><!--/sizeo-->Как изменить описание разделов форума?<!--sizec--></span><!--/sizec-->

<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->.forumdesc,
.forumdesc a:link,
.forumdesc a:visited,
.forumdesc a:active{
&nbsp;&nbsp;&nbsp;&nbsp;background: transparent;
&nbsp;&nbsp;&nbsp;&nbsp;font-size: 10px;
&nbsp;&nbsp;&nbsp;&nbsp;color: #666;
&nbsp;&nbsp;&nbsp;&nbsp;line-height: 135%;
&nbsp;&nbsp;&nbsp;&nbsp;margin: 2px 0 0 0;
&nbsp;&nbsp;&nbsp;&nbsp;padding: 0;
}<!--c2--></div><!--ec2-->
<b>color: #666;</b> - цвет шрифта описания
<b> font-size: 10px;</b> - размер шрифта описания.

<!--sizeo:4--><span style="font-size:14pt;line-height:100%"><!--/sizeo-->Как изменить ширину форума?<!--sizec--></span><!--/sizec-->

<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->#ipbwrapper{
&nbsp;&nbsp;&nbsp;&nbsp;margin: 20px auto 20px auto; /* centers the box, no matter the overall width, also applies a 20px gap at the top and bottom of the board */
&nbsp;&nbsp;&nbsp;&nbsp;text-align: left; /* re_aligns text to left second part of two part MSIE centering workaround */
&nbsp;&nbsp;&nbsp;&nbsp;/* EDIT THIS TO CHANGE THE WIDTH OF THE BOARD -> 960px is a common fixed resolution size */
&nbsp;&nbsp;&nbsp;&nbsp;width: 98%;
}<!--c2--></div><!--ec2-->
Строка <b>width: 98%;</b> - отвечает за размер форума.
Чем больше вы ставите число, тем шире становится ваш форум.
Так же его можно вообще сделать фиксированным по ширине, поменяв <b>%</b> на <b>px</b>.

<!--sizeo:4--><span style="font-size:14pt;line-height:100%"><!--/sizeo-->Как сделать рамку вокруг форума?<!--sizec--></span><!--/sizec-->

Для этого нужно найти участок:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->#ipbwrapper{
&nbsp;&nbsp;&nbsp;&nbsp;margin: 20px auto 20px auto; /* centers the box, no matter the overall width, also applies a 20px gap at the top and bottom of the board */
&nbsp;&nbsp;&nbsp;&nbsp;text-align: left; /* re_aligns text to left second part of two part MSIE centering workaround */
&nbsp;&nbsp;&nbsp;&nbsp;/* EDIT THIS TO CHANGE THE WIDTH OF THE BOARD -> 960px is a common fixed resolution size */
&nbsp;&nbsp;&nbsp;&nbsp;width: 98%;
}<!--c2--></div><!--ec2-->
И заменить его на:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->#ipbwrapper{
&nbsp;&nbsp;&nbsp;&nbsp;margin: 20px auto 20px auto; /* centers the box, no matter the overall width, also applies a 20px gap at the top and bottom of the board */
&nbsp;&nbsp;&nbsp;&nbsp;text-align: left; /* re_aligns text to left second part of two part MSIE centering workaround */
&nbsp;&nbsp;&nbsp;&nbsp;/* EDIT THIS TO CHANGE THE WIDTH OF THE BOARD -> 960px is a common fixed resolution size */
&nbsp;&nbsp;&nbsp;&nbsp;width: 98%;
&nbsp;&nbsp;&nbsp;&nbsp;border: 5px solid #000;
}<!--c2--></div><!--ec2-->
Строка - <b>border: 5px solid #000;</b> и будет являться вашей рамкой.

<!--sizeo:4--><span style="font-size:14pt;line-height:100%"><!--/sizeo-->Как изменить фон форума?<!--sizec--></span><!--/sizec-->

Нужно найти:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->#ipbwrapper{
&nbsp;&nbsp;&nbsp;&nbsp;margin: 20px auto 20px auto; /* centers the box, no matter the overall width, also applies a 20px gap at the top and bottom of the board */
&nbsp;&nbsp;&nbsp;&nbsp;text-align: left; /* re_aligns text to left second part of two part MSIE centering workaround */
&nbsp;&nbsp;&nbsp;&nbsp;/* EDIT THIS TO CHANGE THE WIDTH OF THE BOARD -> 960px is a common fixed resolution size */
&nbsp;&nbsp;&nbsp;&nbsp;width: 98%;
}<!--c2--></div><!--ec2-->
И заменить на:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->#ipbwrapper{
&nbsp;&nbsp;&nbsp;&nbsp;margin: 20px auto 20px auto; /* centers the box, no matter the overall width, also applies a 20px gap at the top and bottom of the board */
&nbsp;&nbsp;&nbsp;&nbsp;text-align: left; /* re_aligns text to left second part of two part MSIE centering workaround */
&nbsp;&nbsp;&nbsp;&nbsp;/* EDIT THIS TO CHANGE THE WIDTH OF THE BOARD -> 960px is a common fixed resolution size */
&nbsp;&nbsp;&nbsp;&nbsp;width: 98%;
&nbsp;&nbsp;&nbsp;&nbsp;background: #FFF;
}<!--c2--></div><!--ec2-->
Строка <b>background: #FFF;</b> будет являться фоном форума.

<!--sizeo:4--><span style="font-size:14pt;line-height:100%"><!--/sizeo-->Как сделать фоновую картинку?<!--sizec--></span><!--/sizec-->

Чтобы поместить картинку на фон форума, необходимо найти:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->body{
&nbsp;&nbsp;&nbsp;&nbsp;background: #FFF;<!--c2--></div><!--ec2-->
И заменить на:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->body{
&nbsp;&nbsp;&nbsp;&nbsp;background: #FFF url(style_images/<#IMG_DIR#>/background.jpg);<!--c2--></div><!--ec2-->
<b>background.jpg</b> - это фоновая картинка форума.

<!--sizeo:4--><span style="font-size:14pt;line-height:100%"><!--/sizeo-->Как удалить рамку в меню навигации?<!--sizec--></span><!--/sizec-->

Для удаления рамки из меню навигации, необходимо найти:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->.ipb-top-left-link,
.ipb-top-right-link
{
&nbsp;&nbsp;&nbsp;&nbsp;background: transparent url(style_images/<#IMG_DIR#>/tile_sub-lite.gif);
&nbsp;&nbsp;&nbsp;&nbsp;float: right;
&nbsp;&nbsp;&nbsp;&nbsp;font-size: 10px;
&nbsp;&nbsp;&nbsp;&nbsp;font-weight: bold;
&nbsp;&nbsp;&nbsp;&nbsp;letter-spacing: 0.5px;
&nbsp;&nbsp;&nbsp;&nbsp;margin: 0px;
&nbsp;&nbsp;&nbsp;&nbsp;padding: 7px 0 7px 0;
&nbsp;&nbsp;&nbsp;&nbsp;width: auto;
&nbsp;&nbsp;&nbsp;&nbsp;border-left:&nbsp;&nbsp;1px solid #dce3ee;
}<!--c2--></div><!--ec2-->
И заменить на:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->.ipb-top-left-link,
.ipb-top-right-link
{
&nbsp;&nbsp;&nbsp;&nbsp;background: transparent url(style_images/<#IMG_DIR#>/tile_sub-lite.gif);
&nbsp;&nbsp;&nbsp;&nbsp;float: right;
&nbsp;&nbsp;&nbsp;&nbsp;font-size: 10px;
&nbsp;&nbsp;&nbsp;&nbsp;font-weight: bold;
&nbsp;&nbsp;&nbsp;&nbsp;letter-spacing: 0.5px;
&nbsp;&nbsp;&nbsp;&nbsp;margin: 0px;
&nbsp;&nbsp;&nbsp;&nbsp;padding: 7px 0 7px 0;
&nbsp;&nbsp;&nbsp;&nbsp;width: auto;
&nbsp;&nbsp;&nbsp;&nbsp;border-left:&nbsp;&nbsp;0;
}<!--c2--></div><!--ec2-->
Найти:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->.ipb-top-left-link
{
&nbsp;&nbsp;&nbsp;&nbsp;float: left;
&nbsp;&nbsp;&nbsp;&nbsp;border-left: 0px;
&nbsp;&nbsp;&nbsp;&nbsp;border-right: 1px solid #dce3ee;
}<!--c2--></div><!--ec2-->
Заменить на:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->.ipb-top-left-link
{
&nbsp;&nbsp;&nbsp;&nbsp;float: left;
&nbsp;&nbsp;&nbsp;&nbsp;border-left: 0px;
&nbsp;&nbsp;&nbsp;&nbsp;border-right: 0;
}<!--c2--></div><!--ec2-->

<!--sizeo:4--><span style="font-size:14pt;line-height:100%"><!--/sizeo-->Как изменить вид тегов CODE, QUOTE?<!--sizec--></span><!--/sizec-->

За этим отвечает участок:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->.quotetop{
&nbsp;&nbsp;&nbsp;&nbsp;background: #E4EAF2 url(style_images/<#IMG_DIR#>/css_img_quote.gif) no-repeat right;
&nbsp;&nbsp;&nbsp;&nbsp;border: 1px dotted #000;
&nbsp;&nbsp;&nbsp;&nbsp;border-bottom: 0;
&nbsp;&nbsp;&nbsp;&nbsp;border-left: 4px solid #8394B2;
&nbsp;&nbsp;&nbsp;&nbsp;color: #000;
&nbsp;&nbsp;&nbsp;&nbsp;font-weight: bold;
&nbsp;&nbsp;&nbsp;&nbsp;font-size: 10px;
&nbsp;&nbsp;&nbsp;&nbsp;margin: 2px auto 0 auto;
&nbsp;&nbsp;&nbsp;&nbsp;padding: 3px;
}

.quotemain{
&nbsp;&nbsp;&nbsp;&nbsp;background: #FAFCFE;
&nbsp;&nbsp;&nbsp;&nbsp;border: 1px dotted #000;
&nbsp;&nbsp;&nbsp;&nbsp;border-left: 4px solid #8394B2;
&nbsp;&nbsp;&nbsp;&nbsp;border-top: 0;
&nbsp;&nbsp;&nbsp;&nbsp;color: #465584;
&nbsp;&nbsp;&nbsp;&nbsp;padding: 4px;
&nbsp;&nbsp;&nbsp;&nbsp;margin: 0 auto 0 auto;
}

.codetop,
.sqltop,
.htmltop{
&nbsp;&nbsp;&nbsp;&nbsp;background: #FDDBCC url(style_images/<#IMG_DIR#>/css_img_code.gif) no-repeat right;
&nbsp;&nbsp;&nbsp;&nbsp;color: #000;
&nbsp;&nbsp;&nbsp;&nbsp;font-weight: bold;
&nbsp;&nbsp;&nbsp;&nbsp;margin: 0 auto 0 auto;
&nbsp;&nbsp;&nbsp;&nbsp;padding: 3px;
}<!--c2--></div><!--ec2-->
<b>color</b> - цвет текста
<b>background</b> - цвет фона.

<!--sizeo:4--><span style="font-size:14pt;line-height:100%"><!--/sizeo-->Как уменьшить высоту названий категорий?<!--sizec--></span><!--/sizec-->

Для этого нужно найти участок:
<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->.borderwrap h3,
.maintitle,
.maintitlecollapse{
&nbsp;&nbsp;&nbsp;&nbsp;background: url(style_images/<#IMG_DIR#>/tile_cat.gif);
&nbsp;&nbsp;&nbsp;&nbsp;border: 1px solid #FFF;
&nbsp;&nbsp;&nbsp;&nbsp;border-bottom: 1px solid #5176B5;
&nbsp;&nbsp;&nbsp;&nbsp;color: #FFF;
&nbsp;&nbsp;&nbsp;&nbsp;font-size: 12px;
&nbsp;&nbsp;&nbsp;&nbsp;font-weight: bold;
&nbsp;&nbsp;&nbsp;&nbsp;margin: 0px;
&nbsp;&nbsp;&nbsp;&nbsp;padding: 8px;
}<!--c2--></div><!--ec2-->
Строка - <b>padding: 8px;</b> отвечает за высоту названий категорий.
 
Статус
В этой теме нельзя размещать новые ответы.
Сверху