Как сделать якорь markdown
Обновлено: 07.07.2024
Markdown призван быть простым и для чтения и для записи, насколько это возможно.
Читаемость, однако, подчеркиваю, превыше всего. Документ в Markdown формате должен восприниматься как есть, как обычный текст, что бы не бросались в глаза ни теги, ни инструкции форматирования. Синтаксис Markdown испытал влияние нескольких существующих фильтров преобразования текста в HTML (в том числе Setext, atx, Textile, reStructuredText, Grutatext, и EtText) и крупнейший источник вдохновения для Markdown синтаксиса был простой текст электронных писем.
Поэтому синтаксис Markdown состоит полностью из знаков препинания и пунктуации, которые были тщательно отобраны, чтобы выглядеть тем, что они означают. Например звездочки вокруг слова на самом деле обращают на себя *внимание* 1 . Markdown списки выглядят, ну, как списки. Даже цитаты выглядят как цитаты отрывков текста, хорошо знакомые вам, если вы когда-либо использовали электронную почту.
Вставка HTML
Для создания разметки, которую синтаксис Markdown не обеспечивает, можно просто использовать сам HTML. Нет необходимости обёртывать HTML в какие-либо специальные разделители, чтобы достигнуть переключения из Markdown в HTML; достаточно начать использовать тэги HTML.
Единственное ограничение состоит в том, что блочные элементы HTML (то есть
Синтаксис форматирования Markdown не обрабатывается внутри блочных элементов HTML. Например, нельзя использовать маркдауновское *выделение текста* (см. ниже) внутри блока HTML.
Внутристрочные тэги HTML (то есть , , и т. п.) могут использоваться где угодно внутри маркдауновских абзацев, элементов списков, в заголовках. Если угодно, тэги HTML можно использовать вместо маркдауновского форматирования: например, если автор текста предпочитает HTMLовские элементы или маркдауновскому синтаксису гиперссылок и изображений соответственно, то может пользоваться ими, и тем невозбранно достигнуть желаемого.
В отличие от блочных элементов HTML, во внутристрочных элементах HTML обрабатывается синтаксис Markdown.
Автоматическое кодирование специальных символов
В языке HTML есть два символа, требующих специального к себе отношения: это
— и, стало быть, прерывают им обычное течение текста в абзаце.
Заголовки
Цитаты
Цитаты могут содержать и другие элементы Markdown — заголовки, списки, кодовые блоки:
Многие текстовые редакторы понимают email-подобный стиль цитирования, способны применять его к выделенному пользователем тексту, увеличивать и уменьшать уровень вложенности цитаты; это обстоятельство делает такие редакторы (например, BBEdit) полезными при работе с цитатами в Markdown.
Списки
Markdown позволяет составлять нумерованные и ненумерованные списки.
В качестве маркеров ненумерованного списка используются звёздочки, или плюсы, или дефисы; эти символы могут для этой цели использоваться взаимозаменяемо.
Скажем, вот этот пример:
совершенно равносилен вот этому:
Нумерованные списки используют в качестве маркеров числа с точкою:
Конкретные числа, которые используются при разметке списка, не оказывают никакого влияния на производящийся Маркдауном итоговый HTML-код. По вышеприведённому списку Markdown изготовит такой HTML-код:
Если вместо этого записать список так:
то получится совершенно тот же HTML-код. Смысл в том, что при желании автор может использовать порядковые номера элементов в списке, чтобы они соответствовали номерам, получающимся в HTML. Но также автор может и не тратить на это своё время, если это не особенно для него важно.
Однако в любом случае нумерация нумерованного списка должна начинаться с единицы, хотя создатель Markdown предполагает, что в дальнейшем развитии Markdown может начать поддерживать нумерацию, начинающуюся произвольным числом.
Маркеры списков обычно начинаются с начала строки, но им могут предшествовать до трёх пробелов. За маркером должен следовать либо пробел (один или более), либо символ табуляции.
Для красоты можно снабжать последующие строки списка отступами:
Но если нет надобности, то на это можно не тратить время:
Если элементы списка разделяются пустыми строками, то Markdown обернёт эти элементы тэгами
в своём итоговом HTML-коде. Скажем, вот этот список:
будет преобразован к виду
а зато вот этот:
будет преобразован к виду
Элементы списка могут состоять из нескольких абзацев. Второй, и третий, и каждый последующий абзац элемента должны снабжаться отступом из четырёх пробелов или одного символа табуляции:
Список выглядит красиво, если отступом снабжать каждую строку. Но если нет времени этим заниматься, то для Markdown достаточно снабдить им только первую строку абзаца:
Чтобы поместить кодовый блок внутри элемента списка, этот кодовый блок надобно снабдить двукратным отступом, то есть либо восемью пробелами, либо двумя символами табуляции:
К сожалению, нумерованный список можно начать случайно, просто написав что- нибудь в таком духе:
(то есть, иными словами, написав в начале строки последовательность, состоящую из числа, точки и пробела). Чтобы избежать этого эффекта, можно перед точкою поставить обратную косую черту:
Впрочем, поскольку в настоящее время Markdown позволяет начинать нумерацию списка только с единицы, этим эффектом можно пренебречь.
Блоки кода
Блоки отформатированного кода приводятся в статьях о программировании или о разметке текста, когда возникает надобность процитировать исходники. В отличие от обычных абзацев, переносы строк в кодовом блоке воспринимаются буквально. Markdown обрамляет кодовый блок сразу двумя элементами HTML — и
будет преобразован Маркдауном в следующий HTML-код:
Один уровень отступа (4 пробела или 1 символ табуляции) устраняются из каждой строки кодового блока. Например, вот этот текст:
будет преобразован к виду
Блок кода продолжается до тех пор, покуда не отыщется строка без отступа (или конец текста).
примет вид следующего HTML-кода:
Обычный синтаксис Markdown не обрабатывается внутри блоков кода. Например, звёздочки внутри кодового блока считаются просто звёздочками в буквальном смысле. Так что нетрудно использовать Markdown, чтобы на нём писать о его собственном синтаксисе, приводя наглядные примеры.
Горизонтальная черта
Чтобы создать горизонтальную черту (соответствующую HTML-элементу ), достаточно поместить три (или более) дефиса, или звёздочки, или символа подчёркивания, на отдельной строке текста. Если угодно, между дефисами или звёздочками можно располагать пробелы. Каждая из следующих строк соответствует горизонтальной черте:
Встроенные элементы
Гиперссылки
Markdown поддерживает три стиля оформления гиперссылок:
Первая пара стилей предполагает, что помимо URLа существует ещё текст ссылки; в разметке он [заключается в квадратные скобки].
Гиперссылка с немедленным указанием адреса
Чтобы создать ссылку с немедленным указанием адреса, надобно немедленно после закрывающей квадратной скобки поместить обычные (круглые) скобки; в этих круглых скобках приводится тот URL, на который указывает гиперссылка, а за ним может ещё быть указан (в кавычках) всплывающий заголовок-подсказка ссылки. Вот пример:
Из этого примера выйдет следующий HTML-код:
Для ссылок на локальный ресурс (то есть расположенный на том же сервере) можно использовать относительные пути:
Гиперссылка, подобная сноске
Ссылка, подобная сноске, вместо целевого адреса использует вторую пару квадратных скобок, внутри которых помещается метка, идентификатор ссылки:
Для разделения двух пар квадратных скобок может использоваться необязательный пробел:
Затем, где угодно в документе, следует определить эту метку ссылки, для чего используется отдельная строка следующего примерно вида:
Строка эта состоит из следующих элементов:
- Идентификатор ссылки, окружённый квадратными скобками (которым может предшествовать необязательный отступ — от одного до трёх пробелов).
- Двоеточие,
- Один или несколько пробелов (или символов табуляции).
- URL гиперссылки.
- Необязательный заголовок (всплывающая подсказка) гиперссылки, заключённый либо в двойные или одиночные кавычки, либо в скобки.
Три следующие определения ссылки совершенно равносильны:
URL гиперссылки может (но не обязательно) быть помещён в угловые кавычки:
Можно поместить заголовок на следующей строке, а перед ним отступ из пробелов (или символов табуляции); с длинными URL такая запись выглядит красивее:
Такие определения ссылок используются только для создания самих ссылок при обработке текста в Markdown; из итогового HTML-кода определения ссылок убираются.
Идентификаторы ссылок могут состоять из букв, цифр, пробелов и знаков пунктуации, однако они не чувствительны к регистру. Например, вот эти две ссылки:
и затем определить гиперссылку:
Так как имена ссылок могут содержать пробелы, то этот способ сработает и тогда, когда текст гиперссылки состоит из нескольких слов:
А затем определите гиперссылку:
Такие определения ссылок могут располагаться где угодно внутри документа Markdown. Можно располагать их в конце каждого параграфа, в котором они используются, или в конце всего документа, наподобие сносок.
Преимущество гиперссылок, подобных сноскам
Вот пример англоязычного текста, снабжённого сноскоподобными гиперссылками:
Используя подразумеваемый ярлык гиперссылки, вместо этого можно записать:
Каждый из этих примеров преобразуется Маркдауном к следующему HTML-виду:
Для сравнения, вот тот же абзац, записанный в Markdown ссылками с немедленным указанием адреса:
Смысл ссылок, подобных сноскам, не в том, что их проще записывать. Смысл в том, что с такими ссылками сам абзац занимает 81 символов, в то время как с немедленным указанием адреса он занял бы 176 символов, а в HTML занимает 234 символа. Таким образом, в HTML разметка занимает даже больше места, чем сам текст.
Когда в Markdown используются ссылки, подобные сноскам, исходный документ выглядит ближе к тому виду, который в итоге отображается браузером. Позволяя выносить большинство метаданных, относящихся к разметке, прочь из абзаца, Markdown тем самым позволяет автору добавлять гиперссылки без нарушения повествовательного течения его прозы.
Смысловое выделение текста
Например, вот этот текст:
будет преобразован в следующий HTML-код:
Автор текста волен сам выбрать, какой стиль выделения ему по нраву. Единственное ограничение состоит в том, что начало и конец выделенного фрагмента должны отмечаться одним и тем же символом.
Выделенный фрагмент может находиться и в середине слова:
Чтобы получить звёздочку или символ подчёркивания в той позиции, в которой этот символ в противном случае мог бы быть воспринят как выделение текста, надобно поставить обратную косую черту перед звёздочкою или знаком подчёркивания:
Кодовые фрагменты строк
Он соответствует следующему HTML-коду:
Чтобы использовать обратный апостроф внутри кода в его буквальном значении, используйте парные обратные апострофы для обрамления кодового фрагмента:
HTML-код получится таким:
Обратные апострофы, окружающие код, могут содержать пробелы — один пробел после открывающих апострофов, а один после закрывающих. Это позволяет поместить обратный апостроф (в его буквальном значении) в самом начале и (или) в самом конце кодового фрагмента строки. Вот примеры:
HTML-код этого примера получится таким:
Внутри кодового фрагмента строки все амперсанды и угловые скобки преобразуются к виду соответствующих HTML-сущностей (HTML entities), что упрощает включение примеров на языке HTML. Например, Markdown преобразует вот этот текст:
к следующему HTML-виду:
Можно также написать:
и получить следующий HTML-код:
Изображения
Иными словами, он состоит из следующих элементов:
- Восклицательный знак.
- Квадратные скобки, в которых указывается альтернативный изображению текст (он станет содержимым атрибута alt в элементе img).
- Круглые скобки, содержащие URL или относительный путь изображения, а также (необязательно) содержимое атрибута title (всплывающей подсказки к изображению), заключённое в двойные или одиночные кавычки.
Изображения в подобной сноскам манере записываются следующим образом:
Следует отметить, что Markdown не позволяет задать размеры изображения (ширину, высоту); если же такое задание важно, то следует использовать обычный элемент языка HTML.
Прочее
Простая вставка URL
Markdown поддерживает упрощённый порядок автоматического создания ссылок для URLов и адресов электронной почты: достаточно поместить URL или почтовый адрес в угловые скобки, и Markdown сделает его гиперссылкою. В отличие от вышеописанных стилей, в данном случае сам же URL или почтовый адрес становится и текстом гиперссылки. Скажем, если надобно опубликовать некоторый URL, и одновременно сделать его гиперссылкою, то достаточно написать
и Markdown сделает из него HTML-код
Автоматические ссылки на адреса электронной почты работают аналогично, но над ними Markdown дополнительно совершает псевдослучайные операции десятичного и шестнадцатеричного сущностного кодирования (entity-encoding), чтобы скрыть адрес от автоматических сборщиков почты, которыми пользуются спамеры.
Например, вот такой адрес:
преобразуется к такому примерно виду:
Употребление обратной косой черты
Вот полный список символов, перед которыми в Markdown можно поставить обратную косую черту, чтобы они были восприняты буквально:
Послесловие
Этот текст написан с помощью разметки PHP Markdown Extra.
Изначально не хотел публиковать на своей страничке этот текст, но в русском переводе отсутствовал перевод идеалогии Markdown. Вторым "за" было - гарантия доступности перевода 2 .
Обращать внимание в тексте принято с помощью курсива, или, если этого не хватает, с помощью выделения жирным. В английском языке слово emphasis имеет значения - внимание, выделение, курсив. В оригинале получается что-то вроде игры слов. ↩
Markdown 1 (маркдаун) — облегчённый язык разметки. Первоначально создан Джоном Грубером (англ. John Gruber) и Аароном Шварцем, целью которых являлось создание максимально удобочитаемого и удобного в публикации облегчённого языка разметки.
Маркдаун не является заменой HTML
Содержание
Маркдаун может генерировать содержание статьи автоматически основываясь на заголовках, при этом якоря создаются также автоматически. В месте вывода содержания укажите тег [TOC] . В результате, вы получите вот такой список:
Форматирование текста
Блочные элементы
В маркдаун все блочные элементы (заголовки, списки, абзацы и т.д.) — все, что визуально начинается с новой строки отбивается пустой строкой.
Перенос строки
Перенос строки всегда игнорируется. Это делается для того, чтобы, например, была возможность при наборе держать определенную длину строки, скажем в 80 символов.
Т.к. маркдаун создавался с целью быть удобночитаемым, его нередко используют в текстовых документах и для комфорта читателя лучше не давать тексту расплываться соплёй по экрану. Например, вот так выглядит официальная документация по маркдауну в текстовом виде.
Для переноса строки внутри абзаца нужно использовать два пробела ●● в конце строки.
Технически используется тег
(перенос строки).
UPD: теперь возможно использование переноса строки.
Начертания текста
Курсив обрамляется звездочкой * с обеих сторон текста — *Курсив* .
Жирное начертание двумя ** — **Жирное начертание** .
Жирный курсив, соответственно, тремя *** — ***Жирный курсив*** .
Заголовки
Таблицы
| Item | Value | Quantity |
|---|---|---|
| Computer | 1600 | 3 |
| Phone | 12 | 2 |
| Pipe | 1 | 1 |
Цитаты
Для обозначения цитат достаточно поставить знак > в начале строки.
Буря мглою небо кроет,
Вихри снежные крутя;
Цитаты можно вкладывать друг в друга.
Буря мглою небо кроет,
Вихри снежные крутя;
Внимание! Цитаты на сайте отключены. Этот синтаксис используется для создания врезок.
Списки
Ненумерованный список
Для обозначения ненумерованного списка нужно поставить любой из этих символов -*+ перед каждым элементом списка.
Нумерованный список
Для нумерованного списка его элементы нумеруется.
Порядок нумерации и само число не имеют значения, список будет пронумерован согласно порядку записи элементов.
Списки могут содержать в себе параграфы и цитаты. При этом семантически они действительно будут вложены тегами друг в друга.
This is a list item with two paragraphs. Lorem ipsum dolor
sit amet, consectetuer adipiscing elit. Aliquam hendrerit
mi posuere lectus.
Vestibulum enim wisi, viverra nec, fringilla in, laoreet
vitae, risus. Donec sit amet nisl. Aliquam semper ipsum
sit amet velit.
This is a blockquote
inside a list item.
Suspendisse id sem consectetuer libero luctus adipiscing.
Бывают разные случаи:
Чтобы это не превратилось в элемент списка, необходимо экранировать точку с помощью символа \ . Во всех подобных случаях экранируйте синтаксис.
Горизонтальная линия
Можно делать разными способами отбивая пустой строкой до и после.
Ссылки и изображения
Имеют похожий синтаксис.
Как видно, у картинок вначале идет восклицательный знак ! .
Можно вкладывать друг в друга — вместо названия ссылки вставляется картинка и ссылка становится кликабельной.
Изображения в ссылках
Ссылки сносками
I get 10 times more traffic from Google than from
Yahoo or MSN.
Если название ссылки совпадает с названием тега, можно сделать и так:
I get 10 times more traffic from Google than from
Yahoo or MSN.
При этом регистр не имеет значения. Картинки могут также:
Сноски
Маркдаун может генерировать сноски. Для этого нужно после слова поставить тег сноски [^название_тега] и указать самоу сноску новым абзацем в любом месте документа [^название_тега]: текст тега . Сами сноски автоматически выведутся в конце документа.
Определения
Apple Pomaceous fruit of plants of the genus Malus in
the family Rosaceae. Orange The fruit of an evergreen tree of the genus Citrus.
Прочее
В маркдауне есть умный синтаксис для ссылок и адресов электронной почты:
Во втором случае к ссылке добавилось mailto: , что позволяет по клику запустить почтовую программу.
🎧 Часто пишете, редактируете или оформляете контент? Попробуйте Markdown!
Это мощный инструмент для копирайтеров, веб-разработчиков и контент-менеджеров. С его помощью вы сможете быстро и красиво оформлять текст. Синтаксис встроен в Ghost, Trello, Slack, Хабр и еще множество сервисов. Мы покажем несколько полезных трюков, которые сделают вас суперпользователем Markdown.
🎧 Слушайте аудио-версию этой статьи!
Что такое Markdown
Markdown - облегченный язык разметки, созданный для удобства написания и чтения текстов. Он позволяет набирать текст, не используя HTML. Сам преобразует набранное, и делает это без мусора в коде.
Вот простой пример использования Markdown:
превращается в
Экзотическая кошка - порода кошек с характерной приплюснутой мордочкой.
Попробуйте сами! Онлайн-редактор откроется в новом окне.
Почему Markdown так хорош
Вы скажете, что Markdown бесполезен - ведь можно нажимать на кнопки форматирования в редакторе и не изучать новый язык разметки.
Да, но задумайтесь: сколько времени вы тратите на нажатие этих самых кнопок? Может, секунду или даже меньше. А если вас настигло вдохновение и мысли идут потоком? Даже за секунду легко потерять нить своего повествования.
Просто попробуйте использовать Markdown, и вы удивитесь, насколько естественен его синтаксис. Этим языком пользоваться намного проще, чем чистым HTML.
Когда вы привыкнете к Markdown, вам будет очень сложно вернуться к прошлой жизни бесконечных лишних кликов.
Мы создали для вас шпаргалку, в которой описали основные функции Маркдаун.
Базовое форматирование
Заголовки
Markdown сделает всё сам и отобразит вот так:
Заголовок 2
Заголовок 3
Заголовок 4
Текст
Для форматирования текста в абзаце используются звездочки. Слово между двух звездочек выделяется курсивом, а между двух пар звездочек - жирным шрифтом. Чтобы поставить ссылку, не нужно писать теги и запоминать, что такое атрибуты. Смотрите, как просто:
курсив
жирный
жирный курсив
ссылка
Картинки
Чтобы вставить картинку, используется такой же синтаксис, как у ссылки, только со знаком восклицания:
Как и в HTML, альтернативный текст и описание при наведении - необязательные атрибуты, и вы можете обойтись без них.
Списки
+ пример списка * чтобы сделать подпункт, нажмите tab - подпункт подпункта * второй пункт
- пример списка
- чтобы сделать подпункт, нажмите tab
- подпункт подпункта
- второй пункт
Как видите, неважно, каким символом вы отмечаете пункты - можно хоть всеми по очереди. Вид подпунктов зависит только от условий в CSS.
Для нумерованного списка ничего не нужно - просто расставьте цифры, а Markdown сам добавит нужные теги.
Цитаты
Цитаты оформляются с помощью символа >.
Это цитата
Если продолжить писать дальше, это тоже будет цитата.
Надо дважды поставить "Enter".
Исходный код
Код, как в примерах выше, выделяется обратными апострофами ` - на клавиатуре они находятся на букве Ё. На макбуках эта клавиша возле левого shift или слева от буквы Z.
Три апострофа ``` выделяют блоки кода. Можно указать язык, и Markdown подсветит функции и теги.
Что ещё
Зачеркнутый текст
Чтобы Markdown не воспринимал символ, как форматирование, используйте обратный слэш \.
В предыдущем предложении используется два слэша \\ , потому что первый съедается. Но если, например, указать путь к папке Windows, один слэш отображается корректно - C:\Users\Lenovo\Documents\php.
Продвинутые техники Markdown
Освоив простое форматирование с помощью Маркдауна, вам непременно захочется узнать, как его еще можно использовать. Что ж, продолжим.
Горизонтальная черта
С помощью --- можно заменить . Не забудьте отбить энтером, иначе предыдущий текст превратится в заголовок.
Кстати, это еще один способ для выделения заголовков. С помощью === выделяются заголовки первого уровня, а с --- - второго.
Ссылки
Можно не прописывать адрес ссылки напрямую, а указать её атрибуты отдельно. Получается очень компактно. В коде это выглядит так:
Пример один, пример два.
Такие сноски можно использовать и для картинок.
Если прописать тайтл в обычной ссылке, это тоже сработает:
Наведите мышку: Яндекс
Еще можно поставить ссылку [1] на объясняющую сноску, как в книге.
Заметка в конце блока или статьи. В данном случае - в конце блока. ↩︎
Как открывать ссылки в новом окне в Маркдаун
Все ссылки в стандартном редакторе Markdown открываются в этом же окне. Только HTML-разметка позволяет изменить это. Никакие другие способы не будут работать стабильно и всегда, и в этом есть некоторое неудобство. Но имея заготовленный шаблон (смотрите ниже), вы легко справитесь с этим.
Таблицы на Markdown
Тут у Markdown перед HTML огромное преимущество. В нем делать таблицы гораздо проще:
Выглядит это так:
Заголовок таблицыДругой заголовокЯчейка 1Ячейка 2Ячейка 3Ячейка 4
Символом : можно выровнять столбцы:
В таблице работает любое форматирование:
ВлевоПо центруВправопервая ячейкатекст2зачеркнутая ячейкажирная ячейкакурсивнезачеркнутая ячейкапросто ячейка
Воспринимает ли Markdown HTML
Если вы вставите в статью обычный HTML, редактор поймет, чего вы от него хотели. Например - Курсив Курсив . Это удобно, если нужно прописать классы или атрибуты.
Горячие клавиши для MacOC
Markdown понимает сочетания горячих клавиш и сам вставляет необходимые символы. Например:
- Ctrl/⌘+B - жирный текст;
- Ctrl/⌘+I - Курсив;
- Ctrl/⌘+K - Ссылка;
- Ctrl/⌘+H и многократное нажатие для выбора нужного заголовка.
Горячие клавиши для Windows
- Ctrl+B - жирный текст;
- Ctrl+I - Курсив;
- Ctrl+K - Ссылка;
- Ctrl+H и многократное нажатие для выбора нужного заголовка.
Редакторы Markdown
Кроме использования Маркдауна в поддерживающих его синтаксис сервисах, вы можете попробовать приложения-редакторы.
Markdown для MacOS
Для Apple существует большое количество удобных программ:
Markdown для Windows
Для "микромягких" окошек программ, к сожалению, поменьше:
Что делать дальше
После пары часов использования Маркдауна ваши пальцы начнут летать над клавишами. Вы будете писать очень быстро, на ходу форматируя написанное.
Практикуйтесь, и у вас получатся превосходные статьи:
Маркдаун – облегченный язык разметки, созданный для написания, чтения, оформления веб-текстов.
Частично или полностью язык поддерживается многими проектами:
- CMS и блог-платформами (Drupal, Ghost, Medium);
- крупнейшими хранилищами контента (GitHub, Microsoft Docs);
- мессенджерами (Telegram, Slack);
- текстовыми редакторами (Atom, iA Writer, Typora);
- сервисами для проджект-менеджмента (Todoist, Trello).
Синтаксис Markdown намного проще, чем HTML, но документы .md без проблем конвертируются в .html.
Заголовки и горизонтальные линии
Заголовки H1–H6 выделяются в Markdown с помощью знаков решетки (диез/шарп). Можно просто поставить нужное количество решеток в начале строки, чтобы указать уровень. Или заключить строку с двух сторон по аналогии с HTML-тегами, кому как удобно.
Это H1 или Заголовок I
Это H2 или Заголовок II
Если отделить последовательность дефисов пустой строкой, то H2 не будет. Получится горизонтальная разделительная линия. Ее можно оформить также с помощью звездочек или знака нижнего подчеркивания. Количество символов и пробелов между ними роли не играет.
Выделения текста
Форматирование курсивом и жирным точно есть во всех инструментах, где другие функции Markdown могут быть ограничены. Синтаксис выделения текста и расставления акцентов:
Можно легко комбинировать эти способы выделения.
Списки и отступы
Чтобы оформить строку в элемент маркированного списка, в начале нужно поставить плюс, минус или звездочку. Звездочка не приведет к курсивному выделению, потому что отделяется от слова пробелом.
Если необходимо создать нумерованный список, используйте в начале строки цифру с точкой. Удобно, что нумерация автоматическая: можно вставить любые цифры, и ошибки не будет.
Маркдаун-разметка также позволяет оформлять многоуровневые списки. Уровень обозначается не количеством спецсимволов, как в случае с заголовками, а за счет отступов. Проще не считать пробелы, а каждый новый подпункт выделять табуляцией.
1. Подподпункт 2.1.1
Если пункт списка включает несколько строк или абзацев, нужно соблюдать всё те же отступы, чтобы было красиво оформлено. Ключевые мысли в списках также можно выделять другой разметкой, например, жирным. Примеры:
* __Тезис №1__ Раскрываем тезис.
* __Тезис №2__ Раскрываем тезис.
Ссылки и картинки
Чтобы поставить гиперссылку без анкора, нужно взять URL в угловые скобки. С e-mail – аналогично.
Если вставлять с анкором, то тогда текст ссылки заключается в квадратные скобки, а адрес страницы – в круглые. Рядом с URL можно прописать тайтл, его объявляют в кавычках (он тоже остается внутри круглых скобок).
Это [ссылка]( "Агентство TexTerra") с тайтлом.
– а это безанкорная ссылка.
Чтобы длинные URL не затрудняли чтение и написание документа Markdown, есть вариант присвоения каждой ссылке определенных ID (меток/переменных). Можно сделать это несколькими способами:
Ссылаемся на [блог TexTerra][tt-blog-link] через ID. Объявляем метку позже по аналогии со сносками. Цифрами обозначить тоже можно: [Google][1], [Yandex][2]
Еще можно так встраивать ссылки: [TexTerra] []
[tt-blog-link]: /blog "Блог про интернет-маркетинг"
Синтаксис Markdown для работы с картинками очень похожий. Разница в восклицательном знаке перед первыми квадратными скобками. Ссылке на картинку тоже можно присвоить определенный ID. Примеры:
[logo]: /upload/firmenniy-stil/footer-logo-svg.svg "Наш логотип"
Цитаты и вставки кода
Если безанкорные ссылки оформляются двумя угловыми скобками, то для цитаты нужна только одна такая скобка. Все очень просто:
> Привет! Это цитата
> Это тоже цитата
> Это еще одна цитата
Это ее продолжение (показываем отступом)
> Одна целая цитата
Цитаты вкладываются как в списки, так и в другие цитаты. Цитаты также могут включать в себя заголовки, списки и код.
Просто инлайн-код: `print("Hello, World!")`
Код на JavaScript:
let greeting1 = 'Father!';
let greeting2 = 'Mother!';
Таблицы и чек-боксы
Если поддерживается расширенная версия Markdown, можно вставлять таблицы. Для этого используются всего два символа: вертикальная черта и дефис. Дефисы работают примерно так же, как в случае с горизонтальной линией: отделяют заголовки от других строк, при этом количество символов значения не имеет. Вертикальная черта служит границей между столбцами.
Пример – таблица меток для блоков кода, об этом было в предыдущем разделе:
| Java Script | javascript |
Для любителей чек-листов есть такая возможность. Чек-бокс получится, если в начале строки вставить пробел, заключенный с двух сторон в квадратные скобки. Можно сразу задать выполненную задачу с помощью [X]. С оформлением ссылок по-другому – в квадратных скобках или текст, или ничего.
Важно: экранирование
Мы разобрали с десяток различных символов, которые используются в разметке Markdown. Но что если эти символы нужны нам в самом тексте? Чтобы спецсимволы не исчезали и не влияли на оформление, нужно использовать экранирование. Как и во многих других языках программирования, этим целям служит обратная косая черта (бэкслеш).
Исключение – когда надо вставить внутри кода грависы (обратные тики). Интерпретатор не посчитает их за обозначение инлайн-кода, если только весь участок кода заключен с двух сторон в двойные грависы. Ничего не понятно? На примере все наглядно:
В отличие от HTML, в Markdown не нужно специально экранировать амперсанд (&) или угловую скобку ( Делаем блоги для бизнеса и бренд-медиа
Читайте также: