Тема на орге

Вот нашел интересную тему на орге,может это кому пригодится.

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



Используемый код:

<table class="[B]tborder[/B]" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
<tr>
    <td class="alt1" width="100%">
<div class="smallfont">Hi, this is a vBulletin table. Table class: <strong>tborder</strong>. Td class: <strong>alt1</strong>. Border: 0. Width: 100%. Align: center.</div>
</td>
</tr>
</table>

Теперь, мы можем попытаться изменить класс таблицы. Поскольку сейчас, это -tborder. Давайте изменим это на tcat!

<table class="tcat" ...

Результат:



Используя спецификацию CSS vBulletin, мы можем изменить стиль наших новых или существующих таблиц.
Теперь мы изменим class Td, используя класс таблицы tborder и класс таблицы tcat.

• Класс таблицы: tborder. Td class: alt1:
• 

• Класс таблицы: tcat. Td class: alt2:
• 

Следущий вопрос: как сделать следущую таблицу?



Просто! Используя tr. В вышеупомянутых примерах мы использовали только один tr. Используя два tr, мы можем сделать такую таблицу.

Код который я использовал:

<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
<tr>

<td class="tcat" width="100%">
<div style="text-align: center;">
New Table Title
</div>
</td>

</tr>

<tr>

<td class="alt1" width="100%">
<div class="smallfont">
This is a vBulletin table. Table class: <strong>tborder</strong>. 1st Td class: <strong>tcat</strong>. 1st Td text align: <strong>center</strong>. Second Td class: <strong>alt1</strong>. Border: 0. Width: 100%. Align: center.
</div>
</td>

</tr>
</table>

Table class: tborder. 1st Td class: tcat. 1st Td text align: center. Second Td class: alt1. Border: 0. Width: 100%. Align: center.

Вы хотели бы иметь сворачиваемую таблицу vBulletin. Это просто.
Это - код, который Вы ищете:

<a  style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('my_table')"><img id="collapseimg_my_table" src="$stylevar[imgdir_button]/collapse_tcat$vbcollapse[collapseimg_my_table].gif" alt="" border="0" /></a>

<tbody id="collapseobj_my_table" style="$vbcollapse[collapseobj_my_table]">

"Куда я должен поместить это?" Обычно в вашей первой таблице Td. Используя коды, мы теперь используем..

<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
<tr>

<td class="tcat" width="100%">
<a  style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('my_table')"><img id="collapseimg_my_table" src="$stylevar[imgdir_button]/collapse_tcat$vbcollapse[collapseimg_my_table].gif" alt="" border="0" /></a>
<div style="text-align: center;">
New Table Title
</div>
</td>
<tbody id="collapseobj_my_table" style="$vbcollapse[collapseobj_my_table]">
</tr>

<tr>

<td class="alt1" width="100%">
<div class="smallfont">
[snip]
</div>
</td>

</tr>
</table>

Результат:

1. 
2. 

С таблицами Вы можете сделать то, что хотите! Помните vBulletin - одна большая таблица. Я надеюсь, кому то это поможет.

Жень, ща вопросами тебя закидают
мало не покажется

Originally Posted by Мик

Жень, ща вопросами тебя закидают
мало не покажется

Ну не понять этот материал,это перебор.

Ммм, это конечно хорошо, но вопросы 100% будут. В статье просто дана картинка и написано как сделать - дан готовый код. А вот если подойти с другой стороны - научить не приему, а принципу будет гораздо лучше...

Originally Posted by Sellrion

а принципу будет гораздо лучше...

Ну за принципами,так это Cюда