Example in HTML/CSS |
BBCode |
Output |
<b>bolded text</b> [2],
<strong>bolded text</strong> or
<span style="font-weight: bold;">bolded text</span> |
[b]bolded text[/b] |
bolded text |
<i>italicized text</i> ,
<em>italicized text</em> or
<span style="font-style: italic;">italicized text</span> |
[i]italicized text[/i] |
italicized text |
<ins>underlined text</ins> or
<span style="text-decoration: underline;">underlined text</span> |
[u]underlined text[/u] |
underlined text |
<del>strikethrough text</del> or
<span style="text-decoration: line-through;">strikethrough text</span> |
[s]strikethrough text[/s] |
strikethrough text |
<a href="https://en.wikipedia.org">https://en.wikipedia.org</a>
<a href="https://en.wikipedia.org">English Wikipedia</a> |
[url]https://en.wikipedia.org[/url]
[url=https://en.wikipedia.org]English Wikipedia[/url] |
https://en.wikipedia.org English Wikipedia |
<img src="https://upload.wikimedia.org/wikipedia/commons/7/70/Example.png" alt="This is just an example" /> |
[img alt="This is just an example" ]https://upload.wikimedia.org/wikipedia/commons/7/70/Example.png[/img] |
 |
<img src="Smileys/Face-smile.svg" alt=":-)"> |
:) or [:-)] This would be another way to use the [img]url_img[/img] and must be pre-configured by the forum administrator. (This and other emoticons, depending on the variant. Most BBCodes do not enclose emoticons in square brackets, leading to frequent accidental usage.) |
 (Specific image and size vary.) |
<blockquote><p>quoted text</p></blockquote> (Usually implemented in more advanced ways.) |
[quote]quoted text[/quote]
[quote="author"]quoted text[/quote] (including optional author ) |
Using a Wikipedia template: quoted text
quoted text — author
|
<pre>monospaced text</pre> |
[code]monospaced text[/code] |
monospaced text |
<span style="font-size:30px">Large Text</span> or
<span style="font-size:85%">Smaller Text</span> |
[style size="30px"]Large Text[/style]
[style size="85"]Smaller Text[/style] (The unit of measurement varies with each BBCode variant and could represent pixels, points, or relative HTML sizes.) |
Large Text Smaller Text |
<span style="color:fuchsia;">Text in fuchsia</span> or
<span style="color:#FF00FF;">Text in fuchsia</span> |
[style color="fuchsia"]Text in fuchsia[/style] or
[style color=#FF00FF]Text in fuchsia[/style] or
[color=#FF00FF]Text in fuchsia[/color] (Both HTML color names and hexadecimal color values are generally supported, although on some boards, you must omit the # from selecting a hexadecimal color.) |
Text in fuchsia |
<ul>
<li>Entry A</li>
<li>Entry B</li>
</ul>
<ol>
<li>Entry 1</li>
<li>Entry 2</li>
</ol>
|
[list]
[*]Entry A
[*]Entry B
[/list]
[list=1]
[*]Entry 1
[*]Entry 2
[/list]
Some message boards do not need the square brackets around the markers.[3]
(Many variants for li and /li , list types – unordered and ordered, with different bullets or counter formats – etc.) |
- Entry 1
- Entry 2
|
<table>
<tr>
<td>table cell 1</td>
<td>table cell 2</td>
</tr>
<tr>
<td>table cell 3</td>
<td>table cell 4</td>
</tr>
</table>
|
[table]
[tr]
[td]table cell 1[/td]
[td]table cell 2[/td]
[/tr]
[tr]
[td]table cell 3[/td]
[td]table cell 4[/td]
[/tr]
[/table]
(Some variants for thead , rules, etc.) |
table cell 1 |
table cell 2 |
table cell 3 |
table cell 4 |
|
Source:[4] |