Как работать с Markdown со вкусом GitHub в Linux
Markdown – это язык форматирования, созданный для Интернета. Цель уценки — облегчить жизнь, когда мы пишем в Интернете. Со временем появилось множество разновидностей уценки. Но в этой статье мы сосредоточимся в основном на Github Flavored Markdown (GFM).
Github основан на CommonMark. В GFM поддерживается множество дополнительных функций, таких как таблицы, ограждение кода и т. д. Давайте перейдем к изучению синтаксиса GFM и способов его использования в различных случаях.
Для демонстрации этого я использую VScode, но вы можете выбрать любой подходящий вам редактор Linux. Некоторые редакторы, такие как Atom и Vscode, поддерживают уценку, а для некоторых редакторов нам необходимо установить плагин уценки.
Для работы с уценкой файл необходимо сохранить с расширением .md или .markdown.
Как добавить заголовки в редактор Markdown
В уценке поддерживается 6 уровней заголовков. Чтобы создать заголовок, используйте символ «решетка» (#), за которым следует пробел и имя заголовка. Чем выше значение хеш-функции, тем меньше размер заголовка.
ПРИМЕЧАНИЕ. H1 и H2 по умолчанию будут иметь подчеркнутый стиль.
Heading1
## Heading2
### Heading3
#### Heading4
##### Heading5
###### Heading 6
Иногда вам может потребоваться выровнять заголовок по центру. Но печальная история заключается в том, что выравнивание в уценке по умолчанию не поддерживается. По умолчанию заголовки отображаются с выравниванием по левому краю. Вы можете вставлять теги HTML/CSS в уценку для достижения выравнивания.
<h1 style="text-align:center">MARKDOWN</h1>
<h1 style="text-align:left">MARKDOWN</h1>
<h1 style="text-align:right">MARKDOWN</h1>
<h1 style="text-align:justify">MARKDOWN</h1>
Как добавить комментарии в редактор Markdown
Комментарии — это способ документировать определенные вещи для лучшего понимания кода/документов. Это не будет отображаться механизмом уценки.
<!--
Comment block
-->
Как визуализировать текст в одну строку
Обычно, когда вы вводите что-то в отдельные строки одну за другой, уценка отображает это как одну строку.
Разрывы строк можно создавать двумя способами.
- Мягкий разрыв строки
- Жесткий разрыв
Мягкие разрывы строк можно создать, добавив два пробела в конце строки. Таким образом, уценка будет отображать каждую строку как отдельные строки.
Жесткие разрывы можно создать, вставив пустую строку между каждой строкой.
Как добавить горизонтальные линии
Горизонтальное правило можно создать, разместив три или более звездочек (*), дефисов (-) или подчеркиваний (_). в одну строку. Также можно добавить пространство между ними.
* * *
---
___
Как сделать текст жирным
Чтобы сделать слово или строки ЖИРНЫМ шрифтом, заключите слово или строки между двойными звездочками (**) или двойным подчеркиванием (__).
**Making this sentence bold using double asterisks.**
__Making this sentence bold using double underscore.__
Как сделать текст курсивом
Чтобы сделать слова или строки КУРСИВОМ, окружите слово или строки одинарными звездочками (*) или одинарным подчеркиванием (_).
*Making this line to be italicized using asterisks.*
_Making this line to be italicized using underscore._
Как добавить зачеркивание к линиям
Чтобы ударить что-либо, вам придется использовать двойную тильду. Окружите все, что вам нужно, между двойными тильдами (~~).
I am just striking the word ~~Howdy~~.
~~I am striking off the entire line.~~
Как добавить цитату
Используйте для цитаты символ «больше», чем (>).
> Single line blockquote.
Посмотрите, как отображается приведенная ниже цитата. Обе строки отображаются в одной строке.
> first line
> Second line
> Third line
> Fourth line
Вы можете использовать возврат строки, оставив два пробела в конце каждой строки. Таким образом, каждая строка не будет отображаться в одной строке.
Оставьте альтернативные строки пустыми с префиксом «больше», чем символ. Таким образом, вы можете создать разрыв строки между каждой строкой в одном блоке.
> first line
>
> Second line
>
> Third line
>
> Fourth line
Вы также можете создавать вложенные блочные кавычки, добавляя два символа «больше» (>>).
Создать встроенный код
Используйте BACKTICK для создания встроенного кода. В приведенном ниже примере показано, как создать встроенный код. Посмотрите на словесные примечания и файл readme, который был представлен как встроенный код.
Markdown is one of the best tools for taking `notes` and creating `readme` files.
Добавить подсветку синтаксиса блока кода
Добавьте табуляцию или 4 пробела и поместите свой код, чтобы отобразить его как блок кода. Альтернативно, поместите свой код между тремя обратными кавычками, чтобы блок отображался как блок кода. Здесь следует отметить важную особенность — подсветку синтаксиса. Обычно, когда вы размещаете код внутри блока, к нему не применяется цветовая схема.
```
echo "Hello world"
```
Теперь посмотрите на тот же пример: цветовая схема применяется автоматически. Это возможно, если добавить название языка программирования после трех обратных кавычек, что применит цветовую схему к коду.
```bash
echo "Hello world"
```
Пример кода Python.
```python
def fp():
print("Hello World!!!")
fp()
```
Пример SQL-запроса.
```sql
SELECT MAX(SALARY_EMP) FROM EMPLOYEE_TABLE
WHERE SALARY_EMP<(SELECT MAX(SALARY_EMP) FROM EMPLOYEE_TABLE)
```
Создание упорядоченных и неупорядоченных списков
Элементы могут быть организованы в упорядоченные и неупорядоченные списки в уценке. Чтобы создать упорядоченный список, добавьте числа, за которыми следует точка. Здесь следует отметить интересный момент: числа не обязательно должны быть последовательными. Механизм Markdown достаточно умен, чтобы понять, что это упорядоченный список, даже если мы выполняем непоследовательный порядок.
В приведенном ниже примере вы можете видеть, что я создал упорядоченный список с непоследовательным порядком (10, 15, 150), но механизм уценки отображает его в правильном порядке. Вы также можете создать вложенный список, как показано на изображении.
Чтобы создать неупорядоченный список, используйте знак плюса (+), звездочки (*) или тире (-), за которыми следует пробел и содержимое списка. Подобно упорядоченному списку, здесь вы также можете создать вложенный список.
Создать список задач
Это особенность GFM. Вы можете создать список задач, как показано на изображении ниже. Чтобы пометить задачу как выполненную, вам нужно добавить ’x’ между квадратными скобками, как показано на изображении.
Добавить ссылки в текст
Чтобы добавить ссылку, следуйте приведенному ниже синтаксису.
[Tecmint](https://linux-console.net "The best site for Linux")
Давайте разобьем синтаксис на 3 части.
- Текст для отображения – это текст, который будет помещен в квадратные скобки ([Tecmint]).
- Ссылка – вы поместите реальную ссылку в круглые скобки.
- Заголовок. При наведении курсора мыши на текст отображается всплывающая подсказка для ссылки. Название должно быть заключено в кавычки, как показано на рисунке.
На изображении ниже вы можете видеть, что «Tecmint» — это мой отображаемый текст, и когда я нажимаю на него, он перенаправляет меня на «linux-console.net».
Вы также можете создавать ссылки, помещая их в угловые скобки < >>code>.
Добавьте ссылки на изображения
Синтаксис изображения похож на добавление ссылок. Чтобы добавить изображение, следуйте приведенному ниже синтаксису.
Давайте разобьем синтаксис на 3 части.
- Альтернативный текст – альтернативный текст будет помещен в квадратные скобки (![alt-text]). Если изображение повреждено или не может загрузиться, этот текст будет отображаться вместе с неработающим символом.
- Ссылка – внутри скобок вы поместите настоящую ссылку на изображение.
- Название – при наведении указателя мыши на изображение отображается его название. Название должно быть заключено в кавычки, как показано на рисунке.
Вы также можете создать ссылку с изображениями. Когда пользователь нажимает на изображение, оно будет перенаправлено на внешнюю ссылку. Синтаксис остается прежним с небольшими изменениями. Окружите тот же синтаксис, который мы использовали для вставки изображения в квадратные скобки, за которым следует ссылка внутри круглых скобок.
[](https://en.wikipedia.org/wiki/Markdown)
Создать таблицу
Таблицы не поддерживаются в исходной версии уценки. Это одна из особенностей GFM. Давайте посмотрим, как построить таблицу поэтапно.
Первая часть — создать имена столбцов. Имена столбцов можно создавать, разделяя их вертикальной чертой (|).
| EMPLOYEE_NAME | EMPLOYEE_AGE | EMPLOYEE_ID |
Во второй строке используйте тире (-) в сочетании с двоеточием (:). Тире сообщают механизму уценки, что это должно быть отображено в виде таблицы, а двоеточие решает, должен ли наш текст быть выровнен по центру, левому или правому краю.
| EMPLOYEE_NAME | EMPLOYEE_AGE | EMPLOYEE_ID |
|:-------------:|:-------------|------------:|
:---: ⇒ Center alignment
:--- ⇒ Left alignment
---: ⇒ Right alignment
С третьей строки можно приступить к созданию записей. Записи должны быть разделены вертикальной чертой (|).
| EMPLOYEE_NAME | EMPLOYEE_AGE | EMPLOYEE_ID |
|:-------------:|:-------------|------------:|
| Ravi | 30 | 127 |
| karthick | 27 | 128 |
На изображении выше видно, что таблица отображается правильно. Столбец 1 выравнивается по центру, столбцы 2 и 3 — по левому и правому краю. Если вы используете Vscode, вы можете использовать «Markdown Table Prettifier», чтобы аккуратно отформатировать таблицу.
Создайте Эмодзи
GFM поддерживает широкий спектр смайлов. Взгляните на шпаргалку по смайликам.
Вот и все, что касается этой статьи. Если у вас есть какие-либо отзывы, пожалуйста, оставьте их в разделе комментариев.