С помощью сервиса Tables Generator

можно быстро получить код html-таблицы для вставки ее в статью на блог

Здравствуй, читатель!
Здесь я расскажу свой опыт как сделать таблицу html быстро и просто. Ведь иногда при написании статей возникает потребность разместить в этих статьях табличные данные. Писать «вручную» html-код для таблицы — это довольно хлопотное занятие для меня, а использование «конвертации» в html из Excel или Word дает довольно избыточный код для таблицы.

Сейчас в таких случаях я пользуюсь сервисом Tables Generator

как сделать таблицу html Tables Generator

Чтобы получить html-код таблицы для публикации в статье я использую следующий порядок действий.

1. Сперва подготавливаю исходную таблицу в MS Excel и экспортирую ее окончательный вариант в файл с расширением .csv.

2. Далее загружаю файл с расширением .csv в Tables Generator

Загружаем таблицу из Excel в  Tables Generator

3. Потом, при необходимости, редактирую загруженную таблицу уже в самом Tables Generator. В сервисе есть достаточный набор инструментов плюс есть готовые шаблоны представления таблиц.

Редактируем таблицу  в  Tables Generator

4. Заключительный момент — генерация html-кода таблицы. Нажав кнопку «Generate» ниже в окне получаю html-код таблицы, который можно скопировать и вставить в статью на блог. Код может быть с встроенными стилями, без стилей, а также в компактном виде (одной строкой). Я использую код без CSS, так как использую свои стили на блоге.

Генерируем html-код таблицы  в  Tables Generator
s

Единственный недостаток сервиса — размер столбцов таблицы может генерироваться в абсолютных значениях. Это может приводить к некорректному отображению таблицы при изменении размеров окна браузера. И посему в таком случае уже на блоге я делаю небольшую корректировку кода, заменяя абсолютные размеры относительными

Кореектировка кода  таблицы Tables Generator

Пример таблиц, сделанных по такой технологии: http://electrostal.com.ua/diametr-vala-elektrodvigatelya.html

Возможно, ты знаешь другие способы быстрого создания кода таблиц — поделись в комментариях внизу страницы.

Удачи!
Александр Коваль

  • Ссылка на Tables Generator: http://www.tablesgenerator.com/html_tables
Метки: