CSS — Резиновая таблица

Опишу несколько скриптов которые использую для создания резиновой таблицы в верстке.

  1. StackTable.js
    Скрипт создает вторую таблицу для узких экранов (основная таблица скрывается), таблица становится в две колоноки и первая из них это thead th нашей основной таблицы.
    Инструкция и примеры на странице скрипта StackTable.js
    Тот же принцип таблицы для Angular.
  2. Responsive Tables from ZUBR
    Этот скрипт оставляет первую колонку фиксированной остальные проматываются как слайд.
    Хорошая статья о задумки скрипта (на английком)
    CSS - Резиновая таблица
  3. Самый простой вариант это воспользоваться Bootstrap. Таблица срабатывает на узких экранах как в предыдущем случае но без фиксированной колонки. Все работает на чистом CSS.
  4. Для тех кто хочет сделать совсем крутую таблицу предлагаю по пробывать использовать этот скрипт. У него много вариаций вывода таблиц, думаю вы найдете себе лучший вариант.CSS - Резиновая таблица

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *