Практический online-курс

Как писать разметку (markdown)

В последнее время было много разговоров о разметке, как альтернативом способе форматирования текста.
Разметка является простым языком, который облегчает написание хорошего контента для веб-страниц без необходимости беспокоиться о HTML коде.
Преимущество использования разметки в том, что ваши статьи могут быть написаны существенно чище, и это также делает их более легкими для чтения не открывая страницы в браузере.

Как пишется разметка

Написание разметки это самое простое, что вы можете себе представить:

Жирный шрифт и курсив

Для создания текста курсивом нужно просто окружить текст одной звездочкой:

 Это *italic text*


Чтобы сделать текст жирным, вставьте две звезды:

Это **bold text.**

Заголовки

Для создания заголовков в разметке, все что вам нужно, это добавить хэш знак перед контентом:

# Это Заголовок1
## Это Заголовок2
### Это Заголовок3
#### Это Заголовок4
##### Это Заголовок5
###### Это Заголовок6


Параграфы

Написание параграфов так же просто, как написание текста, и если вы хотите добавить еще один параграф, вам просто нужно нажать клавишу ВВОД (Enter) и в следующей строке будет добавлен новый параграф, это также эквивалентно:

<p>Один параграф</p>
<p>Второй параграф</p>


Цитаты

Для создания цитат вам нужно добавить угловые скобки (>) перед текстом, вот так:

> Однажды мудрец сказал...


Это точно также как:

<blockquote>
<p>Однажды мудрец сказал...</p>
<blockquote>


Ссылки

Создание ссылок очень похоже на HTML, сначала в квадратных скобках пишется текст который вы хотите, чтобы видел пользователь, а затем пишеться адрес ссылки расположеный внутри пары круглых скобок:

[WebDesignMagazine](//www.webdesignmagazine.ru)


Что является эквивалентом:

<a href=”//www.webdesignmagazine.ru”>WebDesignMagazine</a>


Изображения

Изображения используют тот же синтаксис что и ссылки, но в них, текст который вы поместите в квадратные скобки будет alt текстом, и вы также перед всем нужно писать восклицательный знак, чтобы дать разметке понять, что то, что вы пишете это картинка, а не ссылка:

![Моя картинка](//example.com/моякартинка.jpg)


Точно тоже, что и:

<img src=”//example.com/моякартинка.jpg” alt=”Моя картинка” />


Неупорядоченные списки

Для создания простого неупорядоченного списка, нужно лишь создать элементы списка. Вам не нужно беспокоиться по поводу открытия и закрытия списка. Все, что нужно сделать, это добавить разрыв строки, а затем добавить звездочку перед каждым элементом:

* Первый элемент списка
* Второй элемент списка
* И третий элемент списка


Эквивалент этому:

<ul>
<li>Первый элемент списка</li>
<li>Второй элемент списка</li>
<li>И третий элемент списка</li>
</ul>


Упорядоченные списки

Как и в неупорядоченных списках, вам только нужно беспокоиться о самих элементах списка, нет никакого открытия или закрытия. Чтобы использовать упорядоченный список нужно просто добавить цифры вместо звездочек:

1 Первый элемент списка
2 Второй элемент списка
3 И третий элемент списка


Эквивалент этому:

<ol>
<li>Первый элемент списка</li>
<li>Второй элемент списка</li>
<li>И третий элемент списка</li>
</ol>


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

20-03-2016

LPgenerator — профессиональная Landing Page платформа для увеличения продаж вашего бизнеса

  • Более 500 шаблонов в галерее
  • Инструменты оптимизации конверсии
  • Статистика и сквозная аналитика
  • CRM для работы с заявками и телефония
  • Визуальный редактор с расширенным функционалом
  • Быстрая техническая поддержка
  • Множество интеграций
  • Окупаемость инструмента — от 7 дней
blog comments powered by Disqus
copyright © 2011–2017 by LPgenerator LLC. Все права защищены
Запрещено любое копирование материалов ресурса без письменного согласия владельца — ООО "ЛПгенератор".