Опубликовано вПро Сайты
Адаптивная таблица на CSS и HTML без Bootstrap
Верстка адаптивной таблицы на чистом CSS и HTML. Совсем недавно мне понадобилось сверстать таблицу, которая была бы адаптивна к мобильным разрешениям. Для начала сверстаем простую таблицу HTML с небольшим количеством ячеек. Код HTML: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body> <table id='adap-table'> <thead> <tr> <th>Устройство</th> <th>Цена</th> <th>Время</th> <th>Гарантия</th> </tr> </thead> <tbody> <tr> <td data-label="Устройство" class="active">Apple</td> <td data-label="Цена">10 000</td> <td data-label="Время">2 часа</td> <td data-label="Гарантия">1 год</td> </tr> <tr> <td data-label="Устройство">LG</td> <td data-label="Цена">5 000</td> <td data-label="Время">1 час</td> <td data-label="Гарантия">1 год</td> </tr> <tr> <td data-label="Устройство">SONY</td> <td data-label="Цена">5 000</td> <td data-label="Время">1 час</td> <td data-label="Гарантия">1 год</td> </tr> </tbody> </table> <body> </html>…



