Генератор HTML-таблиц
Таблица, которая нужна вам — а не таблица, которую вы чуть не открыли в Excel
Прайс-листы, сравнения характеристик или сводки по отгрузке редко оправдывают Excel и последующую чистку HTML. Этот генератор HTML-таблиц начинается с числа строк и столбцов, позволяет вводить текст в ячейки и выдаёт `<table>` для вставки в блоки CMS, модули рассылок или внутренние вики. Если вы сравниваете создатель HTML-таблиц с ручной вёрсткой, процесс здесь ближе к редактированию небольшой сетки, чем к работе с книгой. Структуру меняете на панели инструментов, форматируете содержимое inline — предпросмотр и панель HTML остаются синхронными. Удобно, когда нужно один раз сгенерировать HTML таблицы и опубликовать.
Разметка, которой можно доверять до продакшена
Сетка 4×6 — это двадцать четыре тега `<td>`, плюс `<thead>`, если первая строка — заголовок. Одного незакрытого тега или `rowspan`, не совпадающего со следующей строкой, достаточно, чтобы сломать шаблон письма или отправить блок CMS в безопасный режим. Редактор на этой странице рассчитан на такую работу: меняйте размер строк и столбцов, объединяйте подписи через Shift+клик, выделяйте цену жирным, вставляйте ссылки и изображения с компьютера, не выходя из сетки. На уровне таблицы задаёте то, что требуют шаблоны: `border`, `cellpadding`, `width`, `id`, `class`, схлопывание рамок и несколько цветовых тем — без ручной покраски каждой ячейки. Когда вёрстка в предпросмотре устраивает, перейдите на вкладку HTML и скопируйте фрагмент или скачайте полный документ с базовым CSS таблицы для быстрой проверки в браузере.
Многие инструменты для HTML таблиц ограничиваются экспортом из электронных таблиц или показывают код без достоверного рендера. Здесь предпросмотр и исходник связаны: слева правки, справа отрисовка, теги в один клик. Такая двусторонняя проверка рано ловит лишние ячейки после объединения, пропущенный `</th>` или отступы, которые в сетке выглядят нормально, а в iframe — нет. Обработка остаётся в браузере — содержимое таблицы не загружается для «конвертации».
Открыть генератор HTML-таблицРедактирование и предпросмотр рядом
Изменения в сетке одновременно обновляют живой предпросмотр и строку экспорта — не нужно угадывать, как запишутся атрибуты.
Изображения по URL или с компьютера
Фото товаров или иконки в ячейке по ссылке или локальному файлу — удобно для каталогов и сравнительных таблиц.
Фрагмент или полный документ
Копируйте только `<table>` для существующих страниц или экспортируйте HTML-файл для быстрой проверки в браузере.
Чем этот генератор HTML-таблиц отличается
Сфокусированный сеточный редактор, честная разметка и предпросмотр, который находит ошибки до вставки — не ещё один шаг экспорта из Excel.
Короче путь от пустой сетки до HTML, готового к вставке
Задайте строки и столбцы, при необходимости сделайте первую строку заголовком `<thead>`, добавьте подпись и заполните ячейки — без экспорта из таблицы. Вставка строки, удаление столбца, объединение — всё в меню «Таблица», на одном экране. На выходе простая разметка таблицы, как ждут CMS и почтовые инструменты — не обёртка с нежелательными inline-стилями.
- Сетка с объединением и форматированием
- Предпросмотр и HTML синхронны
- Локальные изображения в ячейках
- В браузере — без загрузки
Как пользоваться генератором HTML-таблиц
Задать форму таблицы
Укажите число строк и столбцов, включите «Первая строка — заголовок», если верхняя строка должна быть `<th>`, в параметрах таблицы задайте ширину, рамки, подпись или тему. Размер можно менять позже — объединения и содержимое сохранятся, если сетка позволяет.
Заполнить и форматировать ячейки
Щёлкните ячейку и введите текст. Панель форматирования — для выделения, ссылок или изображений (URL или локально). Объединение: начальная ячейка, Shift+щелчок по противоположному углу, затем «Объединить ячейки» в меню Таблица. «Разделить ячейку» возвращает отдельные ячейки.
Сверить предпросмотр и HTML
Держите вкладку Предпросмотр открытой при правках. Если что-то не так — столбцы сместились после объединения, заголовок не охватывает — проверьте `colspan` и `rowspan` в HTML. Это сокращает поход в предпросмотр CMS.
Экспортировать и проверить в реальной среде
Скопируйте фрагмент, скачайте `.html` или отправьте таблицу в Playground на главной. Почтовые клиенты и CMS всё ещё ведут себя по-разному — краткая проверка в целевой среде полезна — но вы начинаете с чистых семантических тегов таблицы, а не с починки.
FAQ — генератор HTML-таблиц
Готовы создать таблицу?
Набросайте сетку, сверьте предпросмотр с HTML и копируйте, когда всё совпадает.
Генератор HTML-таблиц
- Сетка с объединением и форматированием
- Локальные изображения и живой предпросмотр
- Экспорт фрагмента или полного HTML
- No signup; use the tool in the browser
Почтовые клиенты и CMS всё ещё различаются — после вставки проверьте отступы в реальной среде.
HTML `<table>`, готовый к вставке
Создайте визуально, проверьте в предпросмотре, скопируйте ту же разметку с вкладки HTML.