Перейти к публикации
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. Их много, поэтому описывать буду постепенно и с перерывами.

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

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

Меня удивляет, почему 120%?

100 не выставляли?

А вообще, может быть, что сам форум идёт в графической таблице (а-ля ibr style) и потому кажется что расширяется фон.

Опубликовано:
А вообще, может быть, что сам форум идёт в графической таблице (а-ля ibr style) и потому кажется что расширяется фон.

И как удалить эту таблицу?

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

Там нет таблицы.

Вы не ответили на вопрос, есть ли дополнительный "враппер" ?

Уберите 120%, установите 99.

Опубликовано:
body {
font-family: Verdana, Tahoma, Arial, Trebuchet MS, Sans-Serif, Georgia, Courier, Times New Roman, Serif;
font-size: 10px;
line-height: 135%;
margin: 0;
padding: 0;
text-align: center;
color: #fff;
background-color: #0C1318;
}

/* 
* ========================================
* Set up IPB table
* ========================================
*/

.ipbtable { width:100% }

table.ipbtable,
tr.ipbtable,
td.ipbtable
{ /* required for text in tables, because tables do not inherit from body */
background: transparent;
color: #fff;
font-size: 10px;
line-height: 135%;
}

.ipbtable td,
.divpad{ /* gives all tables faux cellpadding of 5px */
padding: 5px;
}

td.nopad{ /* allows some tables to have no padding on the td */
padding: 0;
}

form{
display: inline;
margin: 0; /* removes mystery form tag gapping */
padding: 0; /* removes mystery form tag gapping */
}

img{
border: 0; /* makes sure linked images do not have a border */
vertical-align: middle;
}

/* 
* ========================================
* global hyperlink styles 
* ========================================
*/

a:link,
a:visited,
a:active{
background: transparent;
color: #BFD6E3;
text-decoration: none;
font-weight: bold;
}

a:hover{
background: transparent;
color: #fff;
font-weight: bold;
}

/* 
* ========================================
* Main wrapper, this controls the overall width of the board in you browser view window. 
* ========================================
*/

#ipbwrapper{ 
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 */
text-align: left; /* re_aligns text to left second part of two part MSIE centering workaround */
/* EDIT THIS TO CHANGE THE WIDTH OF THE BOARD -> 750px is a common fixed resolution size */
width: 99%;
}

/*

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

А что в общем шаблоне, я не про css спрашивала.

Общий шаблон откроется при нажатии верхнего пункта в свойствах стиля.

Ширина может быть задана там дополнительными тегами или таблицей.

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

Еще раз извеняюсь, просто раньне неприходилось работать со стилями, поэтому мало просвещен)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xml:lang="en" lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=<% CHARSET %>" />
<link rel="shortcut icon" href="favicon.ico" />
<title><% TITLE %></title>
<% GENERATOR %> 
<% CSS %> 
<% javascript %> 
</head> 
<body>
<div id="ipbwrapper">
<table style="padding: 4px; border: 1px solid #000; background-color:#18242D;  width:85%;" align="center">
<tr>
  <td>
<% BOARD HEADER %> 
<% NAVIGATION %>
<% MEMBER BAR %>
<!--IBF.NEWPMBOX-->
<% BOARD %>
<% BOARD FOOTER %>
<% STATS %> 
<% COPYRIGHT %>
<center>BoH Dark Blue 2.1.1 © Tom ( <a href="http://www.chillroom.org" target="_blank">Chill Room</a> )</center>
<center>Offical upgrade for IPB 2.1.x &copy Michael  ( <a href="http://www.invisionfuse.com" target="_blank">Invision Fuse</a> )</center>
<center>Contribution from Sully  ( <a href="http://www.iceradio.be/" target="_blank">IceRadio</a> )</center>
</td></tr></table>
</div>
</body> 
</html>

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

Ну вот здесь изменить width:85%; на width:100%; или подобрать другой нужный размер ;)

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

Спасибо огромное!

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

У меня не получается изменить шрифт сообщений. Я его менял во всех местах, где это возможно, но шрифт как был маленьким, так и остался. Что делать?

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

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

В классе postcolor какой размер?

Опубликовано:
В классе postcolor какой размер?

Спасибо, разобрался ;)

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

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

Помогите пожалуйста! Как мне убрать фон форума (серый оттенок на рисунке)

post-10898-1211647880_thumb.jpg

 

P.S. думаю последнее такое сообщение делаю! :)

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

В общем шаблоне форума рамочка прописана?

Или на div-ах обрамление построено?

Посмотрите, какие классы участвуют.

Что перед тегом стоит?

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

Вот мой общий шаблон форума:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xml:lang="en" lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=<% CHARSET %>" />
<link rel="shortcut icon" href="style_images/<#IMG_DIR#>/favicon.ico" type="image/x-icon" />
<title><% TITLE %></title>
<% GENERATOR %> 
<% CSS %> 
<% javascript %> 
</head> 
<body>
<center><table id="container" cellspacing="0" cellpadding="0"><tr><td id="left"><img src="style_images/<#IMG_DIR#>/spacer.gif" style='width:23px;' alt='' /></td>
<td><div id="ipbwrapper">
<% BOARD HEADER %>
<div id='ft'><div id='ft_tl'><div id='ft_tr'><div id='ft_bl'><div id='ft_br'><div id='forum'>
<% MEMBER BAR %>
<!--TOP_BANNER_ROTATION-->
<b><DIV align=center><TABLE cellSpacing=1 cellPadding=0  border=0></DIV>
<TD width="">
<DIV align=center><SPAN id=clock>
<script language=javascript>
</SCRIPT>
</TABLE>
</SPAN></DIV></b>
<% NAVIGATION %>
<!--IBF.NEWPMBOX-->
<% BOARD %>
<% STATS %> 
<% COPYRIGHT %>
<% BOARD FOOTER %>
<!--BOTTOM_BANNER_ROTATION-->	
</div></div></div></div></div></div>
<div id='footer'><a href='java script:scroll(0,0)'><img src='style_images/<#IMG_DIR#>/footer_ls.gif' alt='' style='float:left;' /></a><img src='style_images/<#IMG_DIR#>/footer_rs.gif' alt='' /></div>
</div>
</td>
<td id="right"><img src="style_images/<#IMG_DIR#>/spacer.gif" style='width:23px;' alt='' /></td>
</tr></table></center>
</body> 
</html>

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

Вижу массу ошибок синтексиса в ротаторе баннеров...

Но речь не о нем.

<div id='ft'><div id='ft_tl'><div id='ft_tr'><div id='ft_bl'><div id='ft_br'><div id='forum'>

.......

</div></div></div></div></div></div>

Если это обрамление удалить, что получится?

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

Сейчас на странице 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.