Skip to content

Instantly share code, notes, and snippets.

@Jekins
Last active April 10, 2024 13:05
Show Gist options
  • Save Jekins/2bf2d0638163f1294637 to your computer and use it in GitHub Desktop.
Save Jekins/2bf2d0638163f1294637 to your computer and use it in GitHub Desktop.
Руководство по оформлению Markdown файлов

Руководство по оформлению Markdown файлов

Markdown - это облегчённый язык разметки, который преобразует текст в структурированный HTML. Следующее руководство поможет вам разобраться, как использовать Markdown.

Заголовки

# Заголовок первого уровня
## Заголовок второго уровня
### Заголовок третьего уровня
#### Заголовок четвёртого уровня
##### Заголовок пятого уровня
###### Заголовок шестого уровня

Пример:

Заголовок первого уровня

Заголовок второго уровня

Заголовок третьего уровня

Заголовок четвёртого уровня

Заголовок пятого уровня
Заголовок шестого уровня

Параграфы и переносы строк

Это параграф. Чтобы создать новый параграф, оставьте пустую строку между двумя строками текста.

Это первая строка  
И это вторая строка, но они находятся в одном параграфе. Для переноса строки используйте два пробела в конце предыдущей строки.

Пример:

Это параграф. Чтобы создать новый параграф, оставьте пустую строку между двумя строками текста.

Это первая строка
И это вторая строка, но они находятся в одном параграфе. Для переноса строки используйте два пробела в конце предыдущей строки.


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

*курсив*  
_курсив_

**жирный**  
__жирный__

***жирный курсив***  
___жирный курсив___

~~зачеркнутый~~

Пример:

курсив
курсив

жирный
жирный

жирный курсив
жирный курсив

зачеркнутый


Списки

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

1. Пункт первый
2. Пункт второй
3. Пункт третий

Пример:

  1. Пункт первый
  2. Пункт второй
  3. Пункт третий

Маркированный список

- Пункт первый
- Пункт второй
- Пункт третий

Пример:

  • Пункт первый
  • Пункт второй
  • Пункт третий

Вложенные списки

Также можно делать вложенные списки, добавляя 4 пробела перед пунктом:

1. Пункт первый
    - Подпункт первый
    - Подпункт второй
2. Пункт второй

Пример:

  1. Пункт первый
    • Подпункт первый
    • Подпункт второй
  2. Пункт второй

Ссылки

[Текст ссылки](https://www.example.com)

Пример:

Текст ссылки


Изображения

![Текст описания](https://www.example.com/image.jpg)

Пример:

Текст описания


Блоки кода

Строка кода

`строка кода`

Пример:

строка кода


Блок кода

Удалите символы \

\```
Блок кода
\```

Пример:

Блок кода

Подсветка кода

Для блоков кода можно указывать язык программирования.

Используется подсветка синтаксиса из библиотеки linguist, которая включает множество различных языков.

Удалите символы \

\```python
print("Привет, мир!")
\```

Пример:

print("Привет, мир!")

Цитаты

> Первый уровень цитирования
>> Второй уровень цитирования
>>> Третий уровень цитирования

Пример:

Первый уровень цитирования

Второй уровень цитирования

Третий уровень цитирования


Горизонтальная линия

---

Пример:



Таблицы

| Заголовок 1 | Заголовок 2 |
| ----------- | ----------- |
| Ячейка 1    | Ячейка 2   |
| Ячейка 3    | Ячейка 4   |

Пример:

Заголовок 1 Заголовок 2
Ячейка 1 Ячейка 2
Ячейка 3 Ячейка 4

Таблица как HTML

<table>
    <tr>
        <th>Заголовок 1</th>
        <th>Заголовок 2</th>
    </tr>
    <tr>
        <td>Ячейка 1.1</td>
        <td>Ячейка 2.1</td>
    </tr>
    <tr>
        <td>Ячейка 1.2</td>
        <td>Ячейка 2.2</td>
    </tr>
</table>

Пример:

Заголовок 1 Заголовок 2
Ячейка 1.1 Ячейка 2.1
Ячейка 1.2 Ячейка 2.2

Чек-листы

- [x] Задача 1
- [ ] Задача 2
- [ ] Задача 3

Пример:

  • Задача 1
  • Задача 2
  • Задача 3

Внутренние ссылки

[Перейти к Заголовку 1](#title1)

## <a id="title1">Заголовок 1</a>
Какой-то контент

Пример:

Перейти к Заголовку 1

Какой-то контент


Ссылка на заголовок на английском

[Some title 1](#some-title-1)

## Some Title 1
Some content

Пример:

Some title 1

Some Title 1

Some content


Автоматические ссылки

<http://example.com/>

<address@example.com>

Пример

http://example.com/

address@example.com


HTML

Markdown поддерживает использование прямого HTML внутри документа, так что вы можете использовать любые HTML-теги для более сложного оформления:

<kbd>CTRL</kbd> + <kbd>P</kbd>

Пример:

CTRL + P


HTML-коды

Например, вы можете использовать HTML-код &macr; для добавления черты над буквой:

A&macr;

Пример:


Комментарии

Вы можете вставить комментарии в свой markdown-файл, которые не будут отображаться в окончательном отформатированном виде:

[//]: # (Это комментарий, он не будет отображаться)

Пример:


Эмодзи (Github)

Вы можете использовать эмодзи в своих Markdown-файлах. Существует множество эмодзи, которые вы можете использовать, вот некоторые из них:

:smile:
:laughing:
:blush:

Пример:

😄 😆 😊


@vi-k
Copy link

vi-k commented Dec 16, 2020

этот отличный онлайн редактор показывает не то что отобразит github.. а как сделать что-б было видно сразу что будет на github потом?

Внизу в комментарии напишите и нажмите Preview.

@jus1xd
Copy link

jus1xd commented Feb 6, 2021

я люблю неров сори за мт

@vovs03
Copy link

vovs03 commented Feb 17, 2021

Преобразование строк в маркерованный список

Коллеги, может кто сталкивался с таким кейсом: "Как в VScode преобразовать строки в маркерованный список?"
Не особо хочется ручками N-строк проходить.

@SiAnton
Copy link

SiAnton commented Mar 11, 2021

Перемещение, траектория, путь

@artem-bilas
Copy link

Спасибо большое) Подсматриваю иногда.

@maxrys
Copy link

maxrys commented May 18, 2021

Ошибка в:

Также, можно использовать пробел, чтобы отделять 2 пары квадратных скобок:
[пример][id]:

символ ":" не требуется

@maxrys
Copy link

maxrys commented May 18, 2021

гиперссылки, заключённый либо в двойные или одиночные кавычки, либо в скобки

официальная версия Markdown поддерживает только двойные кавычки

@Li-Deheng
Copy link

Li-Deheng commented Jan 5, 2022

Task List

Preview
  • Marked
  • Unmarked

Write code
- [x] Marked
- [ ] Unmarked

@nsvk13
Copy link

nsvk13 commented Oct 6, 2022

Спасибо за руководство, очень полезно.

@MikhailMatafonov
Copy link

Ребята! Как делать таблицы на языке верстки Markdown? Видать плохо ищу, но куда бы не зашел нет нигде инфы :(

@Leksystop
Copy link

Leksystop commented Feb 2, 2023 via email

@maxrys
Copy link

maxrys commented Feb 2, 2023

Ребята! Как делать таблицы на языке верстки Markdown? Видать плохо ищу, но куда бы не зашел нет нигде инфы :(

Исторический синтаксис можно проверить тут https://daringfireball.net/projects/markdown/dingus

Таблица (как расширение Github)

колонка 1 колонка 2 колонка 3
значение 1.1 значение 2.1 значение 3.1
значение 1.2 значение 2.2 значение 3.2
значение 1.3 значение 2.3 значение 3.3

в Markdown-формате выглядит как:

| колонка 1    | колонка 2    | колонка 3    |
| ------------ | ------------ | ------------ |
| значение 1.1 | значение 2.1 | значение 3.1 |
| значение 1.2 | значение 2.2 | значение 3.2 |
| значение 1.3 | значение 2.3 | значение 3.3 |

Таблица как код + псевдографика

┌──────────────┬──────────────┬──────────────┐
│ колонка 1    │ колонка 2    │ колонка 3    │
├──────────────┼──────────────┼──────────────┤
│ значение 1.1 │ значение 2.1 │ значение 3.1 │
│ значение 1.2 │ значение 2.2 │ значение 3.2 │
│ значение 1.3 │ значение 2.3 │ значение 3.3 │
└──────────────┴──────────────┴──────────────┘

Таблица как HTML

колонка 1 колонка 2 колонка 3
значение 1.1 значение 2.1 значение 3.1
значение 1.2 значение 2.2 значение 3.2
значение 1.3 значение 2.3 значение 3.3

в Markdown-формате выглядит как:

<table>
    <tr>
        <th>колонка 1</th>
        <th>колонка 2</th>
        <th>колонка 3</th>
    </tr>
    <tr>
        <td>значение 1.1</td>
        <td>значение 2.1</td>
        <td>значение 3.1</td>
    </tr>
    <tr>
        <td>значение 1.2</td>
        <td>значение 2.2</td>
        <td>значение 3.2</td>
    </tr>
    <tr>
        <td>значение 1.3</td>
        <td>значение 2.3</td>
        <td>значение 3.3</td>
    </tr>
</table>

@Li-Deheng
Copy link

Li-Deheng commented Feb 2, 2023

Ребята! Как делать таблицы на языке верстки Markdown? Видать плохо ищу, но куда бы не зашел нет нигде инфы :(

Table in Markdown

Preview
1 2 3 4
Один Два Три Четыре
One Two Free For

Write code
| 1 | 2 | 3 | 4 |
| ---- | ---- | ---- | ---- |
| Один | Два | Три | Четыре |
| One | Two | Free | For |
| 一 | 二 | 三 | 四 |

@MikhailMatafonov
Copy link

Спасибо, за инфу! Разобрал! :)

@DonLemON228
Copy link

Полезный гайд!!!

@dmitryloskutnikov
Copy link

dmitryloskutnikov commented Mar 15, 2023

У меня два вопроса.

  1. Как закрыть заголовок? Т.е., я открыл заголовок, написал нужный текст, а дальше мне нужно написать текст, который будет всегда виден в заметке, а не скрываться при сворачивании заголовка.
  2. Какие названия цветов поддерживаются? Или как можно проще выделять текст нужным цветом?
    <font color="#gray">Этот текст должен быть серым, а получается зеленым</font>
    2023-03-16_00h44_03

@VladimirMakarof
Copy link

спасибо !

Copy link

ghost commented Apr 20, 2023

нашёл нужную инфу спс

@DmitryChrome
Copy link

Подскажите, пожалуйста, как изобразить черту над буквой?

@Jekins
Copy link
Author

Jekins commented May 26, 2023

@DmitryChrome можете попробовать так:

A&macr;

но не везде корректно отображается, бывает не сверху, а рядом отображается

@Jekins
Copy link
Author

Jekins commented May 26, 2023

Обновил документацию по Markdown 😊

@IlyaChakov
Copy link

IlyaChakov commented May 27, 2023

@VladimirMakarof в color = #gray после решетки идет HEX-код цвета, а не его название. Необходимо просто вписать правильный HEX-код, и все будет работать нормально

@Jekins
Copy link
Author

Jekins commented May 27, 2023

@IlyaChakov видимо цвет нельзя задать на гитхаб, так попробовал и не работает:

<h1 color="#218bff">Этот текст должен быть #218bff</h1>

Этот текст должен быть #218bff

@DmitryChrome
Copy link

@Jekins Спасибо, но надо немного другой результат. В виде формулы. Например $ y $ без символов сверху и $ y $ с символом ^ или просто чертой над буквой. Получается только так: $y^-$

@Aziza-Nurimova
Copy link

Добрый вечер, а как заголовок можно отображать в середине ячейки?
вот так:
$$ Заголовок $$
отображается в середине, слова слипаются

@Jekins
Copy link
Author

Jekins commented Jun 25, 2023

@Aziza-Nurimova В Markdown нет встроенной функциональности для выравнивания текста в ячейках таблицы. Стандартное поведение - это выравнивание текста в ячейках по левому краю.

Некоторые расширения Markdown или специфические реализации (например, GitHub Flavored Markdown или Markdown Extra) поддерживают расширенное форматирование таблиц, включая выравнивание текста, но это не является стандартным поведением и может не поддерживаться везде.

Если вам нужно выравнивание текста в ячейках таблицы, рассмотрите возможность использования HTML в md файлах вместо стандартного Markdown. Например, вы можете использовать тег

для выравнивания текста по центру:

<table>
  <tr>
    <th><center>Заголовок 1</center></th>
    <th><center>Заголовок 2</center></th>
  </tr>
  <tr>
    <td>Текст 1</td>
    <td>Текст 2</td>
  </tr>
</table>

Обратите внимание, что поддержка HTML в Markdown может варьироваться в зависимости от реализации.

Заголовок 1 Заголовок 2
Текст текст текст текст 1 Текст текст текст текст 2

@Dm70
Copy link

Dm70 commented Nov 22, 2023

Спасибо! Отличное руководство!:thumbsup: Взял на заметку!!!:pencil2:

@makarovpro
Copy link

Good!

@OleksandrDomin
Copy link

Спасибо, информация помогла в решени проблем.

@Aziza-Nurimova
Copy link

Спасибо за подробный ответ!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment