BBCode - с чем их едят

[ДД]

Коды электронной доски объявлений, или теги (ярлыки) BBCode (Bulletin Board Code), являются одним из способов форматирования текста посланий в SMF и во многих других форумах и электронных досках объявлений.

Детали

Рис.1 Список BBCode (доступных на момент написания урока)

Перечень BBCode и их краткое описание (более подробно остановимся на каждом далее)

• Жирный - выделение жирным.
• Курсив - выделение курсивом.
• Подчеркнутый - подчеркивание текста.
• Зачеркнутый - перечеркивание текста.
• Выровненный текст - выравнивание текста сообщения вручную.
• Выровнять слева - выровнять текст по левому краю.
• По центру - выровнять текст по центру.
• Выровнять справа - выровнять текст по правому краю.
• Шрифт - поменять шрифт текста (из списка доступных).
• Размер шрифта - установить размер шрифта (из списка доступных).
• Цвет текста - установить цвет тексту (из списка доступных).
• Вставить изображение - вставить картинку в текст.
• Гиперссылка - вставить ссылку на страничку.
• E-mail - вставить ссылку на email.
• Вставить ссылку FTP - вставить ссылку на FTP-хранилище.
• С обрамлением - выделить текст обрамлением.
• С тенью - добавить к тексту тень.
• Бегущая строка - переделать текст в бегущую строку.
• Надстрочный - приподнять текст над строкой.
• Подстрочный - опустить текст чуть ниже строки.
• Телетайп - "моноширинный" или "телетайпный" вывод текста.
• Вставить таблицу - возможность вставить таблицу в текст.
• Код - возможность отредактировать текст как фрагмент кода.
• Insert No BBC - отключение BBCode в фрагменте текста.
• Цитата - вставка цитат в текст.
• Неупорядоченный список - список с метками.
• Упорядоченный список - список с нумерацией.
• Горизонтальная линия - вставка в текст разделительной горизонтальной линии.
• Спойлер - вставка спойлера в текст.
• Убрать форматирование - убрать все BBCode из выделенного текста (не путать с Insert No BBC)
• Переключить вид - переключение на расширенный редактор текста и обратно.

[ДД]

Теперь более подробно остановимся на порядке чередования тегов (BBCode)

Все теги имеют два вида:

• открывающий - например [b]
• закрывающий - например [/b]

Закрывающие всегда начинаются с "/"

Если необходимо сделать несколько "вложенных" тегов, то их порядок должен быть следующий:

• открывающие в обычной последовательности: [1][2][3]
• закрывающиеся в обратной последовательности: [/3][/2][/1]

Примеры:

• Какой-то текст с жирным, курсивом и подчеркиванием
  Выглядеть будет так:
  [u][i][b]Какой-то текст с жирным, курсивом и подчеркиванием[/b][/i][/u]
• Текст весь жирный, но курсив и подчеркивание у разных частей
  Выглядит так:
  [b]Текст весь жирный, [i]но курсив[/i] и [u]подчеркивание[/u] у разных частей[/b]
• Более сложно сочетание жирного, курсива и подчеркивания[/b]
  Выглядит так:
  [b]Более сложно [u]сочетание жирного[/u][/b][i][u], курсива[/u] и подчеркивания[/i][/b]

Более сложные сочетания тегов рассмотрим позже.

[ДД]

Теги выделения текста (№№ 1, 2, 3, 4)

Данные теги позволяют выделить фрагменты текста жирным, курсивом, подчеркиванием или перечеркиванием.

• Выделение жирным осуществляется тегами [b]текст[/b]
• Выделение курсивом осуществляется тегами [i]текст[/i]
• Подчеркивание осуществляется тегами [u]текст[/u]
• Перечеркивание осуществляется тегами [s]текст[/s]

Эти теги могут располагаться свободно внутри любых других тегов почти без ограничений.

[ДД]

Теги выравнивания текста (№№ 5, 6, 7, 8 )

Выравнивание текста возможно по центру, слева и справа. Так же есть возможность публиковать выровненный вручную текст.
Примеры:

Вот так будет выглядеть выровненный текст:
Встречаются два людоеда:
- Ты знаешь, а я студента поймал. Сейчас пойду сварю его и съем.
- Ты что, с ума сошел?! Выбрось немедленно! Я тоже недавно студента поймал. Бросил его в котел. Так он, пока варился, всю картошку у меня съел.

Выглядит это так:
[pre]Вот так будет выглядеть выровненный текст:...[/pre]

Выравнивание по левому краю все знакомо - так публикуются тексты в сообщениях по-умолчанию. Но иногда и такое выравнивание надо использовать. Примеры смогу привести когда будем разбираться с таблицами.

Вот так выглядит:
[left]Выравнивание по левому краю все знакомо...[/left]

А вот выравнивание по центру:
Встречаются два людоеда:
- Ты знаешь, а я студента поймал. Сейчас пойду сварю его и съем.
- Ты что, с ума сошел?! Выбрось немедленно! Я тоже недавно студента поймал. Бросил его в котел. Так он, пока варился, всю картошку у меня съел.

Выглядит так:
[center]А вот выравнивание по центру:...[/center]

Ну и выравнивание по правому краю:
Встречаются два людоеда:
- Ты знаешь, а я студента поймал. Сейчас пойду сварю его и съем.
- Ты что, с ума сошел?! Выбрось немедленно! Я тоже недавно студента поймал. Бросил его в котел. Так он, пока варился, всю картошку у меня съел.

Делается так:
[right]Ну и выравнивание по правому краю:...[/right]
Теги выравнивания текста надо применять к абзацам. Если попробовать вставить выравнивание внутри текста - текст разобьется на 3 части: до тегов, внутри тегов и после тегов.
Например:
Текст до выравнивания,

текст с выравниванием по центру

, текст после выравнивания.

Здесь тег выравнивания по центру  вставлен прямо внутри текста:
Текст до выравнивания, [center]текст с выравниванием по центру[/center], текст после выравнивания.
Что и привело к такому "неприятному" результату.
Самое "оптимальное" использование тегов выравнивания - применять их последними к тексту. Исключение, пожалуй, составят теги таблицы. Но к ним мы вернемся позже.

[ДД]

Изменение шрифтов (№№ 9, 10, 11)

Тексту так же можно поменять шрифт, размер и цвет.
Примеры использования шрифтов:

Courier	-	[font=courier]Courier[/font]
Arial	-	[font=arial]Arial[/font]
Arial Black	-	[font=arial black]Arial Black[/font]
Impact	-	[font=impact]Impact[/font]
Verdana	-	[font=verdana]Verdana[/font]
Times New Roman	-	[font=times new roman]Times New Roman[/font]
Georgia	-	[font=georgia]Georgia[/font]
Andale Mono	-	[font=andale mono]Andale Mono[/font]
Trebuchet MS	-	[font=trebuchet ms]Trebuchet MS[/font]
Comic Sans MS	-	[font=comic sans ms]Comic Sans MS[/font]

А вот как можно изменять размеры шрифта:

Шрифт 8pt	-	[size=8pt]Шрифт 8pt[/size]
Шрифт 10pt	-	[size=10pt]Шрифт 10pt[/size]
Шрифт 12pt	-	[size=12pt]Шрифт 12pt[/size]
Шрифт 14pt	-	[size=14pt]Шрифт 14pt[/size]
Шрифт 18pt	-	[size=18pt]Шрифт 18pt[/size]
Шрифт 24pt	-	[size=24pt]Шрифт 24pt[/size]
Шрифт 36pt	-	[size=36pt]Шрифт 36pt[/size]

Так же можно установить размер шрифта вручную просто указав его самому:
Шрифт 20pt
Делается это исправив следующие цифры в теге:
[size=20pt]Шрифт 20pt[/size]
И "на закуску" рассмотрим использование различных цветов в тексте. По-умолчанию форум предлагает следующие стандартные цвета:

Черный	-	[color=black]Черный[/color]
Красный	-	[color=red]Красный[/color]
Желтый	-	[color=yellow]Желтый[/color]
Розовый	-	[color=pink]Розовый[/color]
Зеленый	-	[color=green]Зеленый[/color]
Оранжевый	-	[color=orange]Оранжевый[/color]
Пурпурный	-	[color=purple]Пурпурный[/color]
Синий	-	[color=blue]Синий[/color]
Бежевый	-	[color=beige]Бежевый[/color]
Коричневый	-	[color=brown]Коричневый[/color]
Бирюзовый	-	[color=teal]Бирюзовый[/color]
Фиолетовый	-	[color=navy]Фиолетовый[/color]
Темно-красный	-	[color=maroon]Темно-красный[/color]
Светло-зеленый	-	[color=limegreen]Светло-зеленый[/color]
Белый	-	[color=white]Белый[/color]

Так же есть возможность указывать текст вручную, но для этого надо знать их общепринятое название или шестнадцатеричное значение.
Например:
светло-серый будет выглядеть так: [color=#cccccc]светло-серый[/color]

Рекомендуемый порядок применения тегов шрифтов:

• Если надо применить такое форматирование к отдельным элементам текста - после применения выделения (жирным и т.д.), но перед использованием выравнивания текста  (по центру и т.п.)
• Если же надо применить форматирование ко всему сообщению - используйте эти теги уже после того, как закончите полностью оформлять все остальное форматирование.

[ДД]

Вставка ссылок и картинок в текст (№№ 12, 13, 14, 15)

Форум позволяет вставлять в сообщения изображения и ссылки с помощью следующих тегов:

• Для вставки изображения используется тег [img]ссылка на картинку[/img]
• Для вставки ссылки на другую страничку в интернете используется тег [url]ссылка[/url]
  Его использование возможно в двух вариантах - с подписью ссылки и без:
  
  • Если надо просто вставить ссылку, то используем вариант: [url]здесь пишем ссылку[/url]. Выглядеть это будет вот так, например: http://tuft.rigma.biz/
  • Если мы хотим "скрыть" сам текст ссылки за подписью, то используем такой вариант: [url=здесь пишем саму ссылку]тут пишем описание ссылки[/url]. В результате увидим что-то такое: Форум Василис
• Если мы хотим выделить email так, что бы почтовая программа (если она настроена) автоматически подхватывала указанный адрес и подставляла его в поле Кому, то рекомендуется публиковать email следующим образом: [email]адрес почты[/email]. Будет это выглядеть так: admin@rigma.biz
• Так же если необходимо вставить ссылку на папку или файл, расположенный на FTP-сервере (хранилище файлов) можно воспользоваться тегом [ftp]ссылка на FTP[/ftp]. Будет что-то похожее на: ftp://mirror.yandex.ru/fedora/

Использование другого форматирования внутри данных тегов не допускается (кроме описания ссылки в теге [url][/url]).

[ДД]

Добавление эффектов к тексту (№№ 16, 17, 18)

Форум позволяет применить следующие эффекты к тексту сообщения:
1. Обрамление.
Тег обрамления использует три параметра и позволяет "обвести" контуром текст:
[glow=цвет,толщина,300]Обрамление[/glow]

• цвет может быть указан по аналогии с изменением цвета текста,
• толщина показывает толщину обрамления текста в пикселях,
• назначение третьего параметра я так и не понял

Пример:

Красным 2 пикселя	-	[glow=red,2,300]Красным 2 пикселя[/glow]
Зеленым 3 пикселя	-	[glow=green,3,300]Зеленым 3 пикселя[/glow]

2. Тень
Тег тени создает иллюзию тени к тексту указанного цвета с указанной стороны:
[shadow=цвет,сторона]Тень[/shadow]

• цвет мы используем так же, как и в обрамлении, цвете текста,
• сторона может быть левая (left) или правая (right)

Примеры:

Красная слева	-	[shadow=red,left]Красная слева[/shadow]
Красная справа	-	[shadow=red,right]Красная справа[/shadow]
Бирюзовая слева	-	[shadow=teal,left]Бирюзовая слева[/shadow]

3. И еще один интересный эффект:
Бегущая строкаПозволяет вставить строчку текста, которая будет перемещаться справа налево по кругу.
Используется следующим образом:
[move]Бегущая строка[/move]
Внутри данных тегов можно спокойно использовать практически любой другой тег оформления.

[ДД]

Дополнительное форматирование (№№ 19, 20, 21)

Рассмотрим следующие варианты форматирования текста:

• Надстрочный ^текст
• Подстрочный _текст
• Телетайпный текст

В основном надстрочный и подстрочный тексты используют для "рисования" формул в тексте.
Например:
E=mc² сделано вот так: E=mc[sup]2[/sup]
a⁴ - b⁴ = (a - b)(a + b)(a² + b²) реализовано так: a[sup]4[/sup] - b[sup]4[/sup] = (a - b)(a + b)(a[sup]2[/sup] + b[sup]2[/sup])
log_a 1 = 0 получилось так: log[sub]a[/sub] 1 = 0
Телетайпный формат текста реализует внешний вид по аналогии с старыми телетайпными/телеграфными аппаратами
Оформляется в теги [tt]текст[/tt]
Данные теги можно спокойно сочетать с другими вариантами оформления (выделение, цвет и т.п.).

[ДД]

Работа с таблицами (№22)

Пожалуй самое сложно в тегах - это работа с таблицами. При их форматировании надо помнить много нюансов и быть очень внимательным.
Таблица состоит из трет тегов:

• Сама таблица берется в теги [table][/table]
• Каждая строка таблицы "оборачивается" в теги [tr][/tr]
• Каждая ячейка заключена в теги [td][/td]

Из простых правил надо помнить, что:

• Текст в таблице может размещаться только внутри тегов ячейки [td][/td]
• Число столбцов в каждой строке должно быть одинаковым

Пример простенькой таблицы из 2 строк и 3 столбцов реализовывается так:

Код: [Выделить]

[table]
[tr][td]Строка 1 - Столбец 1[/td][td]Строка 1 - Столбец 2[/td][td]Строка 1 - Столбец 3[/td][/tr]
[tr][td]Строка 2 - Столбец 1[/td][td]Строка 2 - Столбец 2[/td][td]Строка 2 - Столбец 3[/td][/tr]
[/table]Результат будет выглядеть так:

Строка 1 - Столбец 1	Строка 1 - Столбец 2	Строка 1 - Столбец 3
Строка 2 - Столбец 1	Строка 2 - Столбец 2	Строка 2 - Столбец 3

Сочетание тегов внутри и снаружи таблицы позволяет отформатировать текст в читаемый вид. Пожалуй проще всего это показать на следующем примере:

Код: [Выделить]

[center][table]
[tr][td][center][b]№ п/п[/b][/center][/td][td][center][b]Фамилия[/b][/center][/td][td][center][b]Средний бал[/b][/center][/td][/tr]
[tr][td][center][b]1[/b][/center][/td][td][left]Иванов[/left][/td][td][right]23,5[/right][/td][/tr]
[tr][td][center][b]2[/b][/center][/td][td][left]Петров[/left][/td][td][right]18,1[/right][/td][/tr]
[tr][td][center][b]3[/b][/center][/td][td][left]Сидоров[/left][/td][td][right]22,7[/right][/td][/tr]
[/table][/center]Результат выглядит так:

№ п/п	Фамилия	Средний бал
1	Иванов	23,5
2	Петров	18,1
3	Сидоров	22,7

Рассмотрим его подробнее.

• Всю таблицу мы взяли в теги [center][/center] для её выравнивания по центру сообщения.
• Первую строку таблицы считаем "шапкой" и к каждой ячейке применяем теги [b][/b] и [center][/center] для выделения жирным и выравнивания по центру в ячейках.
• Аналогично применяем теги для первого столбца.
• Фамилии лучше размещать выровненными по левому краю, для чего и используем теги [left][/left].
• А вот цифры (особенно с одинаковым количеством знаков после запятой) лучше выровнять по правому краю с помощью тегов [right][/right]
• Повторюсь, но все форматирования обязательно применяются к каждой ячейке отдельно если их не надо применить ко всей таблице сразу (например сделать цвет шрифта в таблице синим и т.п.)

По тегам таблицы могут и будут возникать вопросы, которые можно будет обсудить потом на живых примерах.

[ДД]

Дополнительное форматирование №2 (№№ 23, 24, 25)

Рассмотрим теперь такие элементы форматирования как "вставка кода", "вставка цитаты" и "отключение тегов BBcode".
Эти элементы будут на форуме использоваться реже (кроме цитаты), но вдруг понадобятся кому-то.
Вставка кода осуществляется тегами [code]вставляемый код[/code]. Примеры использования можно увидеть в описании создания таблицы - очень удобно форматировать в наглядный вид. Так же используется для вставки каких-либо "служебных" текстов на странице (сейчас начну страшно материться), например вот кусок кода из одного моего проекта:

Код: [Выделить]

<?php
// brief       Работа с MySQL
// author      Dark Dayver
// version     0.2.0
// details     Содержит класс по работе с БД MySQL.

if (IN_GALLERY !== TRUE)
{
die('HACK!');
}

class db
{
private $link;
var $txt_query;
var $res_query;
var $result = FALSE;
var $aff_rows = FALSE;
var $insert_id = FALSE;
var $error;

function db($dbhost, $dbuser, $dbpass, $dbname)
{
$this->link = @mysql_connect($dbhost, $dbuser, $dbpass) or die ('Error connect DB: ' . mysql_errno($this->link) . ' - ' . mysql_error($this->link));
@mysql_select_db($dbname, $this->link) or die ('Error select DB: ' . mysql_errno($this->link) . ' - ' . mysql_error($this->link));
@mysql_query("SET CHARACTER SET utf8", $this->link);
@mysql_query("SET NAMES 'utf8'", $this->link);
}

private function query()
{
$this->aff_rows = FALSE;
$this->insert_id = FALSE;
$this->res_query = @mysql_query($this->txt_query, $this->link);
if ($this->res_query === FALSE)
{
$this->error = 'Error DB: ' . mysql_errno($this->link) . ' - ' . mysql_error($this->link) . ' - SQL: ' . $this->txt_query;
return FALSE;
}
else
{
$this->aff_rows = @mysql_affected_rows($this->link);
$this->insert_id = @mysql_insert_id($this->link);
return TRUE;
}
}

function select($select, $from_tbl, $where = FALSE, $order = FALSE, $group = FALSE, $limit = FALSE)
{
if (strlen($this->txt_query) > 0) $this->clean();
$this->txt_query = 'SELECT ';
if (!is_array($select))
{
$select = array($select);
}
$selects = '';
foreach ($select as $tmp)
{
if ($tmp == '*' || $tmp[0] == '`' || $tmp[strlen($tmp) - 1] == '`')
{
$selects .= ', ' . $tmp;
}
else
{
$selects .= ', `' . $tmp . '`';
}
}
$selects = substr($selects, 2);
$this->txt_query .= $selects . ' FROM `' . $from_tbl . '`';
if ($where != FALSE) $this->where($where);
if ($order != FALSE) $this->order($order);
if ($group != FALSE) $this->group($group);
if ($limit != FALSE) $this->limit($limit);
return $this->query();
}

function delete($from_tbl, $where = FALSE, $order = FALSE, $limit = FALSE)
{
if (strlen($this->txt_query) > 0) $this->clean();
$this->txt_query = 'DELETE FROM `' . $from_tbl . '`';
if ($where != FALSE) $this->where($where);
if ($order != FALSE) $this->order($order);
if ($limit != FALSE) $this->limit($limit);
return $this->query();
}

function truncate($tbl)
{
if (strlen($this->txt_query) > 0) $this->clean();
$this->txt_query = 'TRUNCATE TABLE `' . $tbl . '`';
return $this->query();
}

function update($update, $to_tbl, $where = FALSE, $order = FALSE, $limit = FALSE)
{
if (strlen($this->txt_query) > 0) $this->clean();
$this->txt_query = 'UPDATE `' . $to_tbl . '` SET ';
$updates = '';
foreach ($update as $key => $value)
{
if ($value === NULL)
{
$updates .= ', `' . $key . '` = NULL';
}
else
{
$updates .= ', `' . $key . "` = '" . $value . "'";
}
}
$this->txt_query .= substr($updates, 2);
if ($where != FALSE) $this->where($where);
if ($order != FALSE) $this->order($order);
if ($limit != FALSE) $this->limit($limit);
return $this->query();
}

function insert($insert, $to_tbl, $type = FALSE)
{
if (strlen($this->txt_query) > 0) $this->clean();
if ($type == 'ignore')
{
$this->txt_query = 'INSERT IGNORE INTO ';
}
else if ($type == 'replace')
{
$this->txt_query = 'REPLACE INTO ';
}
else
{
$this->txt_query = 'INSERT INTO ';
}
$keys = '';
$values = '';
foreach ($insert as $key => $value)
{
$keys .= ', `' . $key . '`';
$values .= ", '" . $value . "'";
}
$this->txt_query .= '`' . $to_tbl . '` (' . substr($keys, 2) . ') VALUES (' . substr($values, 2) . ')';
return $this->query();
}

private function where($where)
{
if (strlen($this->txt_query) > 0)
{
$this->txt_query .= ' WHERE ' . $where;
}
}

private function order($order, $sort = FALSE)
{
if (is_array($order)) list($order, $sort) = each($order);
if (strlen($this->txt_query) > 0)
{
if ($order !== 'rand()')
{
$this->txt_query .= ' ORDER BY `' . $order . '`';
if ($sort == 'down') $this->txt_query .= ' DESC';
else if ($sort == 'up') $this->txt_query .= ' ASC';
}
else $this->txt_query .= ' ORDER BY rand()';
}
}

private function group($group, $sort = FALSE)
{
if (is_array($group)) list($group, $sort) = each($group);
if (strlen($this->txt_query) > 0)
{
$this->txt_query .= ' GROUP BY `' . $group . '`';
if ($sort == 'down')
{
$this->txt_query .= ' DESC';
}
else if ($sort == 'up')
{
$this->txt_query .= ' ASC';
}
}
}

private function limit($limit, $start = 0)
{
if (is_array($limit)) list($limit, $start) = each($limit);
if (strlen($this->txt_query) > 0 && $limit > 0)
{
$this->txt_query .= ' LIMIT ' . $start . ', ' . $limit;
}
}

function res_row()
{
if ($this->res_query)
{
$this->result = @mysql_fetch_assoc($this->res_query);
}
else
{
$this->result = FALSE;
}
return $this->result;
}

function res_arr()
{
if ($this->res_query)
{
$i = 0;
$this->result = array();
while ($tmp = @mysql_fetch_assoc($this->res_query))
{
$this->result[$i] = $tmp;
$i++;
}
if ($i = 0)
{
$this->result = FALSE;
}
}
else
{
$this->result = FALSE;
}
return $this->result;
}

private function clean()
{
$this->txt_query = '';
$this->res_query = FALSE;
$this->result = FALSE;
$this->aff_rows = FALSE;
$this->insert_id = FALSE;
$this->error = '';
}
}
?> Код вставлен просто для показа того, как форум сам раскрасил код в зависимости от назначения его элементов.
Цитаты могут использовать как для цитирования фрагментов инструкций, книг и т.п., так и для цитирования пользователей. Пример цитирования пользователей:

Работа с таблицами (№22)

Выглядит оно так:
[quote author=ДД link=topic=40.msg1239#msg1239 date=1427209923]
...цитируемый текст...
[/quote]

• author=автор - здесь можно указать автора цитаты (можно использовать самому)
• link=ссылка - здесь ссылку на саму цитату (автоматически вставляет форум)
• date=дата в внутреннем формате (автоматически вставляет форум)

Вот пример того, как можно оформить цитату с указанием автора и источника:
[quote author=Алистер Кроули]
[size=14pt]Нетерпимость есть признак бессилия.[/size]
[right][i](с) [url=http://citaty.info/quote/319062]Citaty.Info[/url][/i][/right]
[/quote]
Результат будет выглядеть так:

Нетерпимость есть признак бессилия.

(с) Citaty.Info

Отключение тегов было добавлено на форум как раз для возможности показать в тексте как эти теги следует писать.
Используется оно следующим образом:
[nobbc][b]текст[/b] [u]с[/u] [s]разными[/s] [u]тегами[/u][/nobbc]

[ДД]

Создание списков (№№ 26, 27)

Так же на форуме есть возможность создавать форматированные списки с маркерами или нумерацией.
Как и с таблицей, при форматировании списков, надо быть очень внимательным и помнить о том, что каждый пункт списка должен форматироваться отдельно (если нужен разный внешний вид внутри пунктов).

Рассмотрим пример простого маркированного списка
[list]
[li][b]первая строка списка[/b][/li]
[li][i]вторая строка списка[/i][/li]
[li][u]третья строка списка[/u][/li]
[/list]
Результат будет выглядеть так:

• первая строка списка
• вторая строка списка
• третья строка списка

А вот то же самое в виде нумерованного списка
[list type=decimal]
[li][b]первая строка списка[/b][/li]
[li][i]вторая строка списка[/i][/li]
[li][u]третья строка списка[/u][/li]
[/list]
Результат будет выглядеть так:

• первая строка списка
• вторая строка списка
• третья строка списка

Как видим из указанных примеров, отличие состоит в добавлении в тег самого списка [list][/list] указания типа списка type=decimal следующим образом: [list type=decimal][/list]
Каждая строка списка обязательно заключается в теги [li][/li].
Можно сочетать данные списки и создавать вложенные один в один, но это требует еще большей внимательности при оформлении. Вот пример многоуровневого списка (3 уровня, первый - цифровой, остальные - маркированные):

• Уровень 1
• Уровень 1
  
  • Подуровень 2
  • Подуровень 2
    
    • Подуровень 3
    • Подуровень 3
• Уровень 1
  
  • Подуровень 2
  • Подуровень 2

Сделан список следующим образом:

Код: [Выделить]

[list type=decimal]
[li]Уровень 1[/li]
[li]Уровень 1
[list]
[li]Подуровень 2[/li]
[li]Подуровень 2
[list]
[li]Подуровень 3[/li]
[li]Подуровень 3[/li]
[/list][/li]
[/list][/li]
[li]Уровень 1
[list]
[li]Подуровень 2[/li]
[li]Подуровень 2[/li]
[/list][/li]
[/list]

[ДД]

Дополнительное форматирование №3 (№№ 28, 29)

Из еще одних элементов форматирования можно отметить вставку горизонтальной линии и скрытие текста под спойлер.
Тег горизонтальной линии является одним из исключений и не требует закрывающего тега: [hr]
Очень удобный тег для разделения сообщения на отдельные фрагменты. Его примеры использования уже неоднократно можно было увидеть в этих уроках. Помните, что тег [hr] надо вставлять между абзацами, так как он разделит текст на две части и нарисует между ними горизонтальную линию.
Тег спойлера используется для скрытия большого фрагмента текста и выглядит так:
[spoiler=описание]скрываемый текст[/spoiler]

• Описание - здесь можно написать краткую аннотацию к скрытому тексту или, если ничего не писать, форум автоматически вставит слово "Спойлер".
• Скрываемый текст будет по-умолчанию свернут (так же в настройках форума стоит не показывать текст под спойлером гостям - что можно использовать для скрытия сообщения или его части от гостей).

Пример использования спойлера без описания
[spoiler]Какой-то скрытый текст[/spoiler]

Извините, вам запрещён просмотр содержимого спойлеров.

Тоже самое, но с описанием
[spoiler=Здесь спрятан текст]Другой скрытый текст[/spoiler]

Извините, вам запрещён просмотр содержимого спойлеров.

[ДД]

Удаление форматирования (№30)

Данная кнопка позволяет удалить все теги из выделенного фрагмента текста.
Работает она следующим образом:

• Выделяем фрагмент сообщения из которого надо удалить все теги:
  

  Детали

• Нажимаем кнопку "Убрать форматирование":
  

  Детали

• Получаем текст с удаленными тегами:
  

  Детали

[ДД]

Переключение между видами (№31)

Во время публикации сообщения можно переключить вид вводимого сообщения на "отформатированный" и обратно. В отформатированном можно даже редактировать свое сообщение, но есть одно маленькое НО (куда ж без него).
Если в "отформатированном" виде допустить ошибку в форматировании, то найти и устранить её уже может не получиться. По данной кнопке много расписывать не буду, могу только посоветовать не использовать её без особой на то нужды.

[Tati First]

ДД, Саша, спасибо за краткий, но ёмкий и очень доступный для понимания курс начинающего хакера продвинутого участника форума!

Извините, вам запрещён просмотр содержимого спойлеров.

на досуге обязательно поиграюсь с использованием BBcode