mitorun studio

Памятка по Markdown

Markdown — текстовый формат для удобного написания контента, который потом можно конвертировать в HTML. Это нечто среднее между обычным текстовым форматом .txt и .html. Его используют для записи типового контента на сайтах (статьи, карточки), документаций, README-файлов.

Основные функции из спецификации

Заголовок

# Заголовок H1
## Заголовок H2
### Заголовок H3
#### Заголовок H4
##### Заголовок H5
###### Заголовок H6
<h1>Заголовок H1</h1>
<h2>Заголовок H2</h2>
<h3>Заголовок H3</h3>
<h4>Заголовок H4</h4>
<h5>Заголовок H5</h5>
<h6>Заголовок H6</h6>

Заголовок H1

Заголовок H2

Заголовок H3

Заголовок H4

Заголовок H5

Заголовок H6

Параграф

Это один параграф

Это тоже один
параграф

Это параграф 
с переносом строки
<p>Это один параграф</p>

<p>Это тоже один параграф</p>

<p>Это параграф <br>с переносом строки</p>

Это один параграф

Это тоже один параграф

Это параграф
с переносом строки

Ссылка

Это [строчная ссылка](https://example.com)

Это упрощённая автоматическая ссылка <https://example.com>
<p>Это <a href="https://example.com">строчная ссылка</a></p>

<p>Это упрощённая автоматическая ссылка <a href="https://example.com">https://example.com</a></p>

Это строчная ссылка

Это упрощённая автоматическая ссылка https://example.com

Изображение

![alt картинки](thumbnail.svg)
<img src="thumbnail.svg" alt="alt картинки">

Выделение текста

*Курсивный текст*
**Жирный текст**
***Курсивный и жирный текст***
~~Зачёркнутый текст~~
<p>
	<em>Курсивный текст</em>
	<strong>Жирный текст</strong>
	<em><strong>Курсивный и жирный текст</strong></em>
	<s>Зачёркнутый текст</s>
</p>

Курсивный текст
Жирный текст
Курсивный и жирный текст
Зачёркнутый текст

Ненумерованный список

- Первый пункт списка
- Второй пункт списка
- Третий пункт списка
<ul>
	<li>Первый пункт списка</li>
	<li>Второй пункт списка</li>
	<li>Третий пункт списка</li>
</ul>
  • Первый пункт списка
  • Второй пункт списка
  • Третий пункт списка

Нумерованный список

1. Первый пункт нумерованного списка
2. Второй пункт нумерованного списка
3. Третий пункт нумерованного списка
<ol>
	<li>Первый пункт нумерованного списка</li>
	<li>Второй пункт нумерованного списка</li>
	<li>Третий пункт нумерованного списка</li>
</ol>
  1. Первый пункт нумерованного списка
  2. Второй пункт нумерованного списка
  3. Третий пункт нумерованного списка

Инлайновый код

`inline-code`
<code>inline-code</code>
inline-code

Блок с кодом

```css
.example {
	color: black;
	background-color: lime;
}
```
<pre class="language-css"><code class="language-css">.example {
	color: black;
	background-color: lime;
}</code></pre>
.example {
	color: black;
	background-color: lime;
}

Разделительная черта

\-\-\-
<hr>

Цитата

> Это цитата
<blockquote>
	<p>Это цитата</p>
</blockquote>

Это цитата

Экранирование служебных символов

\*\*Экранирование звёзд\*\*
**\*\*Экранирование звёзд, но с жирным текстом\*\***
<p>
	**Экранирование звёзд**
	<strong>**Экранирование звёзд, но с жирным текстом**</strong>
</p>

**Экранирование звёзд**
**Экранирование звёзд, но с жирным текстом**

Вставка кода HTML

<!-- Комментарий к коду -->
<!-- Комментарий к коду -->

Расширенные возможности

Таблица

| Номер | Продукт | Количество |
|:------|:-------:|-----------:|
| 1     | Банан   | 5          |
| 2     | Стакан  | 214        |
<table>
	<thead>
		<tr>
			<th style="text-align:left">Номер</th>
			<th style="text-align:center">Продукт</th>
			<th style="text-align:right">Количество</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td style="text-align:left">1</td>
			<td style="text-align:center">Банан</td>
			<td style="text-align:right">5</td>
		</tr>
		<tr>
			<td style="text-align:left">2</td>
			<td style="text-align:center">Стакан</td>
			<td style="text-align:right">214</td>
		</tr>
	</tbody>
</table>
НомерПродуктКоличество
1Банан5
2Стакан214
Олег Миторун Фото Олег Миторун