Перевод статьи Per Harald Borgen: "How to make responsiveness super simple with CSS Variables" Если вдруг до этого вы ни разу не слышали о CSS-переменных, то поясним, что это новая функция CSS, благодаря которой в таблице стилей вы получаете все возможности переменных без какой-либо дополнительной настройки. Иначе говоря, CSS-переменные позволяют отойти от старых способов создания стилей: h1 { font-size: 30px; } navbar > a { font-size: 30px; } …в пользу следующего: :root { --base-font-size:...

Очевидно, что прежде чем применить различные свойства CSS к html-таблице необходимо ее создать. О том как это сделать можно прочитать здесь. В моем случае законченный вариант таблицы будет выглядеть вот так: Это довольно простая таблица, состоящая из четырех столбцов и пяти строк. Ее html-код выглядит вот так: Обратите особое внимание на атрибут rowspan, т.к. именно с его помощью мы можем объединить четыре ячейки в первом столбце в одну. Теперь переходим непосредственно к CSS. Начать можно с ширины таблицы...