CSS Table BBCode

Mod BBCode Database
BBCodes that need some file editing or extra files
There is no support here! Only Read Access!
Locked
User avatar
BBCode Bot
BBCoder IV
BBCoder IV
Posts: 239
Joined: 04 Mar 2010, 15:04
Location: bbcode table

CSS Table BBCode

Post by BBCode Bot »

CSS Table BBCode

Author: Stoker
Description: The CSS Table BBCode lets You insert CSS styled tables in the posts.
This Table BBCode looks just the same in all styles.
You need to create 4 bbcodes to make the table bbcode work.
Image
File edits: Insert the following css code in Your stylesheet. For prosilver based styles it is colours.css and for subsilver2 based styles it is stylesheet.css
Feel free to edit the colors.
If You dont want the hover effect, just delete the hover code.

Code: Select all

  table.stoker 
{
text-align: center;
font-size: 14px;
color: #fff;
width: auto;
margin-left: auto;
margin-right: auto;
background-color: #666;
border: 0px;
border-collapse: collapse;
border-spacing: 0px;
}

table.stoker td.headline 
{
background-color: #005501;
color: #fff;
padding: 4px;
text-align: center;
border-bottom: 2px #fff solid;
font-size: 18px;
font-weight: bold;
} 

table.stoker td.headline:hover 
{
background-color: #005501;
color: #fff;
text-decoration: none;
} 

table.stoker td 
{
background-color: #CCC;
color: #000;
padding: 4px 20px 4px 20px;
text-align: left;
border: 1px #fff solid;
}

table.stoker td:hover 
{
background-color: #556b2f;
color: #FFF;
text-decoration: underline;
}

Table:
BBCode:

Code: Select all

[table]{TEXT}[/table]
HTML:

Code: Select all

<table class="stoker" cellspacing="0">
{TEXT}
</table>

Tr:
BBCode:

Code: Select all

[tr]{TEXT}[/tr]
HTML:

Code: Select all

<tr>{TEXT}</tr>

Td Headline:
BBCode:

Code: Select all

[tdo={NUMBER}]{TEXT}[/tdo]
HTML:

Code: Select all

<td class="headline" colspan="{NUMBER}">{TEXT}</td>

Td:
BBCode:

Code: Select all

[td]{TEXT}[/td]
HTML:

Code: Select all

<td>{TEXT}</td>

To make this bbcode work, You have to combine them the right way.
When You have added above BBCodes in ACP, You can use this examplecode on Your own board:

Code: Select all

[table][tr][tdo=5]Styled CSS table[/tdo][/tr][tr][td][b]Some text[/b][/td][td][b]Stoker[/b][/td][td][b]Nerdy[/b][/td][td][b]Peters[/b][/td][td][b]BBCode Bot[/b][/td][/tr][tr][td][b]Home:[/b][/td][td]test[/td][td]test[/td][td]test[/td][td]test[/td][/tr][tr][td][b]1 - 2:[/b][/td][td]test[/td][td]test[/td][td]test[/td][td]test[/td][/tr][tr][td][b]3 - 4:[/b][/td][td]test[/td][td]test[/td][td]test[/td][td]test[/td][/tr][tr][td][b]5 - 6:[/b][/td][td]test[/td][td]test[/td][td]test[/td][td]test[/td][/tr][tr][td][b]7 - 8:[/b][/td][td]test[/td][td]test[/td][td]test[/td][td]test[/td][/tr][tr][td][b]9 - 10:[/b][/td][td]test[/td][td]test[/td][td]test[/td][td]test[/td][/tr][/table]
Demo:
[table][tr][tdo=5]Styled CSS table[/tdo][/tr][tr][td]Some text[/td][td]Stoker[/td][td]Nerdy[/td][td]Peters[/td][td]BBCode Bot[/td][/tr][tr][td]Home:[/td][td]test[/td][td]test[/td][td]test[/td][td]test[/td][/tr][tr][td]1 - 2:[/td][td]test[/td][td]test[/td][td]test[/td][td]test[/td][/tr][tr][td]3 - 4:[/td][td]test[/td][td]test[/td][td]test[/td][td]test[/td][/tr][tr][td]5 - 6:[/td][td]test[/td][td]test[/td][td]test[/td][td]test[/td][/tr][tr][td]7 - 8:[/td][td]test[/td][td]test[/td][td]test[/td][td]test[/td][/tr][tr][td]9 - 10:[/td][td]test[/td][td]test[/td][td]test[/td][td]test[/td][/tr][/table]
Locked