Адаптивные таблицы на CSS

preview_player
Показать описание
В этом уроке мы рассмотрим два очень простых варианта создания адаптивных таблиц на CSS. Буквально несколько простых правил CSS позволят сделать таблицы на сайте адаптивными и удобными для просмотра на мобильных устройствах.

==========================================

💖 Поддержка канала
5168 7574 1613 9071 (ПриватБанк)
TXGoBr7UrwRUYx7FpzbiG8znkgC6fhwtEF (USDT TRC20)
410014621600849 (ЮMoney)
===============================================

Мои курсы на Udemy

Не получается приобрести курс или нужна скидка - обращайтесь. Решим :)

Курс "PHP 8. ООП. Создание собственного PHP MVC фреймворка":

  1. Андрей Кудлай
Рекомендации по теме
Адаптивные таблицы 0:25:20

Адаптивные таблицы

Как сделать адаптивные 0:13:16

Как сделать адаптивные таблицы?

Адаптивные таблицы на 0:17:42

Адаптивные таблицы на CSS

Адаптивный дизайн таблиц 0:13:31

Адаптивный дизайн таблиц

Видеоурок по таблицам 0:11:26

Видеоурок по таблицам html | Адаптивная таблица css

Адаптивные таблицы на 0:11:03

Адаптивные таблицы на Materialize CSS и тень, Подробный видео курс по Materialize CSS #7...

Урок 6 Bootstrap 0:02:25

Урок 6 Bootstrap 4 . Адаптивные таблицы / Table-responsive

Полный гайд по 0:25:11

Полный гайд по CSS Grid: адаптивная верстка за пару минут

Таблицы на CSS, 0:06:12

Таблицы на CSS, свойства для оформления таблиц на языке CSS, Видео курс по CSS, Урок 19...

Как сделать адаптивную 0:15:45

Как сделать адаптивную таблицу на сайте?

Адаптивные таблицы. Холивар. 0:10:28

Адаптивные таблицы. Холивар. Сибирикс.

Адаптация сайта под 0:14:43

Адаптация сайта под мобильные устройства за 10 минут | Адаптивная верстка | Медиа запросы css3...

Как сделать адаптивные 0:04:13

Как сделать адаптивные таблицы в статьях WordPress?

CSS за 3 0:02:43

CSS за 3 минуты. Обзор на каскадные таблицы стилей

Красивые таблицы на 0:04:49

Красивые таблицы на CSS

CSS Grid с 0:05:41

CSS Grid с нуля №4. Адаптивный грид без медиа-запросов

Топ 3 худших 0:00:15

Топ 3 худших программиста на YouTube! #код #айти #программист...

#10 Таблицы: table, 0:07:01

#10 Таблицы: table, th, tr, td, capture, thead, tbody, tfoot [Курс по Верстке от AROKEN]...

3 СПОСОБА, КАК 0:19:26

3 СПОСОБА, КАК СДЕЛАТЬ HTML ТАБЛИЦУ. СОЗДАЕМ АДАПТИВНЫЕ ТАБЛИЦЫ БЕЗ КОДА...

#15. Оформление таблиц 0:07:21

#15. Оформление таблиц в CSS.

#4 Работа с 0:13:42

#4 Работа с таблицами на Bootstrap 4 и Создание адаптивных таблиц, Уроки по Bootstrap 4...

Как сверстать таблицу 0:11:47

Как сверстать таблицу с помощью HTML и CSS | Робот для анализа госконтрактов...

КАК СДЕЛАТЬ ТАБЛИЦУ 0:03:53

КАК СДЕЛАТЬ ТАБЛИЦУ HTML+CSS | КРАСИВАЯ ТАБЛИЦА HTML

HTML и CSS 0:19:26

HTML и CSS с нуля. Урок 4 | Таблицы в HTML

Комментарии
Автор

💖 Поддержка канала
5168 7574 1613 9071 (ПриватБанк)
(USDT TRC20)
410014621600849 (ЮMoney)


Мои курсы на Udemy

Не получается приобрести курс или нужна скидка - обращайтесь. Решим :)

Курс "PHP 8. ООП. Создание собственного PHP MVC фреймворка":




matroskin
Автор

Один из лучших преподавателей. Без воды, без соплёй и без слов паразитов.

timapigolev
Автор

Супер. Урок был очень интересен, спасибо что делитесь своим мастерством.

SergeyL-meof
Автор

Полезный урок! Когда-то тоже искал варианты для адаптивных таблиц в блоках сравнения товаров. Спасибо!

Maxamuzsania
Автор

Тоже считаю что лучшее решение для адаптивных таблиц, это делать удобные и красивые карточки на мобильных устройствах

artem_ib
Автор

Я прописываю обычно еще класс таблице
.tl-fixed {
width: 100%;
table-layout: fixed;
}
.tl-fixed > td {
width: 100%;
}
и потом ее уже в сетку вставляю в любую ".col-*"
Просто при маленьком экране - смотря какая таблица - могут возникать переносы строк
Мне не очень нравятся скроллы, только если без них нельзя, тогда да

Monax-govq
Автор

Интересное решение, я не видел раньше такого, хотя верстал много

alexdreamer
Автор

Приветствую, Андрей. Актуальна ли табличная верстка сейчас, используется ли она сейчас, не проще ли на Grid или Flex?

statistic-pyip
Автор

Дякую за урок, завжди дізнаюсь щось нове. Можливо у Вас знайдеться час, записати урок пошуку по сайту за допомою Ajax, для прикладу коли вводиться декілька букв, заповнюється формочка з варіантами пошуку. І завжди було цікаво, як реалізовується сам пошук, які SQL запити і т. д.

AndriiP