Utilia

Конвертер HTML у Markdown

Конвертуйте HTML у Markdown і Markdown у HTML у браузері: з таблицями GitHub, закресленням, списками завдань і безпечним переглядом. Без завантаження на сервер.

Напрям конвертації

Попередній перегляд

Попередній перегляд очищено: скрипти, форми й обробники подій видалено, а віддалені зображення ніколи не завантажуються.

Як конвертувати HTML у Markdown

  1. Виберіть напрям: HTML → Markdown або Markdown → HTML.
  2. Вставте код у поле введення або натисніть Відкрити файл, щоб завантажити зі свого комп’ютера файл .html, .htm, .md чи .txt (до 10 МБ).
  3. Налаштуйте параметри. Для HTML → Markdown можна вибрати стиль Заголовки, Маркер списку і стиль Блоки коду. Для Markdown → HTML опція Очистити HTML (видалити скрипти й обробники подій) ввімкнена за замовчуванням.
  4. Натисніть Конвертувати. Результат також оновлюється під час введення.
  5. Скопіюйте або завантажте результат. Кнопка Змінити напрям переносить результат назад у поле введення, щоб ви могли конвертувати його у зворотному напрямі й перевірити перетворення туди й назад.

Блок Попередній перегляд під результатом показує, як відображається Markdown, тож ви можете перевірити конвертацію з одного погляду.

Що робить конвертація HTML → Markdown

Конвертер читає ваш HTML власним синтаксичним аналізатором браузера в інертному документі: скрипти не виконуються, а зображення не завантажуються. Потім він обходить структуру сторінки й записує еквівалент кожного елемента в Markdown:

  • <h1>–<h6> стають заголовками. ATX (# Заголовок) записує #–######; Setext (з підкресленням) підкреслює заголовки рівнів 1 і 2 за допомогою === чи --- (рівні 3–6 завжди використовують #).
  • <strong> і <b> стають **жирним**, <em> та <i> стають _курсивом_, рядковий <code> стає зворотними лапками.
  • Посилання стають [текст](url "заголовок"), а зображення – ![alt](src).
  • Списки використовують вибраний маркер (-, * або +); нумеровані списки зберігають свій номер start, а вкладені списки мають відступ.
  • <pre><code> стає блоком коду: Огороджені (```) або З відступом (4 пробіли).
  • <blockquote>, <hr> і переноси рядків також конвертуються.
  • <script>, <style>, <iframe>, <noscript> та подібні елементи видаляються разом із вмістом.

Символи, які інакше сприймалися б як синтаксис Markdown, наприклад * чи # на початку рядка, екрануються зворотною скісною рискою, щоб текст лишався буквальним.

GitHub Flavored Markdown

Коли позначено GitHub Flavored Markdown (таблиці, ~~закреслення~~, списки завдань):

  • Таблиці стають таблицями з вертикальними рисками й вирівняними стовпцями. Заголовок береться з рядка <thead> або рядка, що складається лише з клітинок <th>; якщо його немає, додається порожній рядок заголовка, бо GFM цього вимагає. Вирівнювання стовпців зчитується з align="right" чи style="text-align: center". Вертикальні риски всередині клітинок екрануються як \|, переноси рядків стають <br>, а colspan доповнюється порожніми клітинками. <caption> записується абзацом над таблицею.
  • <del>, <s> та <strike> стають ~~закресленням~~.
  • Прапорці на початку елементів списку стають елементами списку завдань: - [x] виконано, - [ ] зробити.

У Markdown немає еквівалента для вкладених таблиць, об’єднаних рядків чи оформлення клітинок. Таблиця, що містить іншу таблицю, зберігається як необроблений HTML, який приймає більшість засобів відтворення Markdown. Без опції GFM кожна таблиця зберігається як HTML.

Markdown → HTML

У зворотному напрямі Markdown відтворюється синтаксичним аналізатором, що відповідає CommonMark, з розширеннями GFM, коли опцію ввімкнено. Результат – фрагменти HTML, готові для вставлення в CMS, шаблон електронного листа чи вебсторінку. Коли позначено Очистити HTML (видалити скрипти й обробники подій), необроблений HTML, вбудований у Markdown, очищується: теги <script>, атрибути onclick і посилання javascript: видаляються. Знімайте позначку лише для Markdown, який ви написали самі.

Поширені запитання

Чи надсилається мій HTML на сервер?

Ні. Обидві конвертації виконуються повністю у вашому браузері, а сторінка ніколи не завантажує те, що ви вставляєте чи відкриваєте. Ви можете безпечно конвертувати внутрішню документацію чи чернетки.

Чи безпечний попередній перегляд для ненадійного HTML?

Так. Попередній перегляд завжди проходить через DOMPurify: скрипти, форми, фрейми й обробники подій видаляються, посилання відкриваються в новій вкладці без доступу до цієї сторінки, а віддалені зображення ніколи не завантажуються. Відображаються лише зображення, вбудовані як URL data:.

Чому деякі частини моєї сторінки зникають?

Markdown описує лише структуру вмісту. Елементи макета, класи CSS, вбудовані стилі, форми й вбудовані віджети не мають форми в Markdown, тому зберігається лише їхній текст. Скрипти й стилі видаляються повністю.

Чи можна конвертувати цілу вебсторінку?

Так. Вставте повний вихідний код, разом із <html> і <head>: конвертується лише вміст <body>. Для чистішого Markdown вставляйте лише частину зі статтею, а не навігацію та підвал.

Який різновид Markdown використовує результат?

Результат відповідає CommonMark – стандарту, який підтримують GitHub, GitLab, Obsidian, більшість генераторів статичних сайтів і багато редакторів CMS. Таблиці, закреслення та списки завдань відповідають специфікації GitHub Flavored Markdown.