Зрозуміло, чому письменники, дизайнери, розробники, і люди схиблені на техніці обирають Markdown. Це простий та швидкий спосіб форматування статей і звичайного тексту.
В даний час він широко використовується для написання статей, документації, довідок і т.п.
У цій статті ми поговоримо про основний синтаксис та особливості Markdown. Почнемо!
Заголовки
Для написання HTML заголовків у Markdown використовується #. Щоб перемикатися від h1 до h6 ми змінюємо кількість #:
# Заголовок 1
## Заголовок 2
### Заголовок 3
#### Заголовок 4
##### Заголовок 5
###### Заголовок 6
Результат:
Заголовок 1
Заголовок 2
Заголовок 3
Заголовок 4
Заголовок 5
Заголовок 6
Списки
Markdown підтримує два види списків, впорядковані (пронумеровані) і невпорядковані (марковані) списки. Для невпорядкованих списків в якості маркерів використовуються * (зірочки), + (плюси) і - (мінуси):
111
* 222
* 2222
+ 333
+ 3333
+ 33333
- 333
- 3333
- 33333
Результат:
111
- 222
-
2222
- 333
- 3333
-
33333
-
333
- 3333
- 33333
Markdown відстежує нумерацію за вас.
1. 111
2. 222
3. 333
Результат:
- 111
- 222
- 333
Вкладені елементи списку
Для створення вкладених елементів списку вам потрібно просто робити відступи:
1. JavaScript бібліотеки
- jQuery; // 4 пробіли.
* jQuery Mobile // 8 пробілів.
- Node і AngularJS // знову 4 пробіли.
Результат:
- JavaScript бібліотеки
- jQuery;
- jQuery Mobile
- Node і AngularJS
- jQuery;
Горизонтальні лінії
В HTML, ми є тег <hr/> для створення горизонтальної лінії, але в Markdown ми будемо використовуються три або більше дефісів, зірочок, або підкреслень на окремому рядку. Вони всі працюють однаково:
Лінія 1
*******
Результат:
Лінія 1
Параграфи
Щоб написати абзац або текст в HTML, ми використовуємо теги <p> </p>, але у Markdown, блок текст автоматично перетворюється у параграф. Щоб залишити порожній рядок (тег <br> у HTML) використовуються два пробіли:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed consectetur magna in mi elementum rutrum. In elementum vel eros at iaculis. Suspendisse iaculis hendrerit lectus, dapibus porttitor ligula volutpat non.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed consectetur magna in mi elementum rutrum. In elementum vel eros at iaculis. Suspendisse iaculis hendrerit lectus, dapibus porttitor ligula volutpat non.
Результат:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed consectetur magna in mi elementum rutrum. In elementum vel eros at iaculis. Suspendisse iaculis hendrerit lectus, dapibus porttitor ligula volutpat non.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed consectetur magna in mi elementum rutrum. In elementum vel eros at iaculis. Suspendisse iaculis hendrerit lectus, dapibus porttitor ligula volutpat non.
Курсив і напівжирний
*Italic*, так само як і _Italic_.
**Bold**, так само як і __Bold__.
***Italics і bold разом***, так само як і ___Italics і bold разом___.
Результат:
Italic, так само як і Italic.
Bold, так само як і Bold.
Italics і bold разом, так само як і Italics і bold разом.
Код
Щоб написати блок коду, ми можемо використовувати апостроф (```) навколо коду. Коли ми працюємо з inline блоками коду, апостроф використовується один раз:
<nav>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</nav>
або
hello!
Зображення
Щоб додати посилання на зображення, ми будемо використовувати наступний синтаксис:
`` **Alt Text**
Знак оклику (!) необхідний для декларування зображень.
Посилання
Markdown підтримує два стилі для форматування посилань:
[Codeguida](http://codeguida.com/)
Це другий [приклад][1].
[1]: http://example.com
Результат:
Це другий приклад.
Цитати
Щоб виділити цитату просто додайте символ > перед текстовим блоком:
> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed consectetur magna in mi elementum rutrum. In elementum vel eros at iaculis. Suspendisse iaculis hendrerit lectus, dapibus porttitor ligula volutpat non.
Ще немає коментарів