CSS-Задачи №1. Починка дома. Задача на отработку свойства display для начинающих
Можно ли получить ширину и высоту экрана в CSS, не используя JavaScript? Вы можете получить ширину и высоту экрана в виде значений в пикселях, используя несколько строк CSS. - Создано на основе @property и тригонометрических функций. - Можно легко использовать в любой формуле. - Обновляется при изменении размера экрана (нет необходимости в JavaScript) @property --_w { syntax: '<length>'; inherits: true; initial-value: 100vw; } @property --_h { syntax: '<length>'; inherits: true; initial-value: 100vh; } :root { --w: tan(atan2(var(--_w),1px)); /* screen width */ --h: tan(atan2(var(--_h),1px)); /* screen height*/ /* The result is an integer without unit */ } Статья Демо
[CSS] "Резиновые" единицы измерения и формулы их вычисления
Для вычисления резиновых значений ширины и высоты в CSS можно использовать относительные единицы измерения, такие как проценты или vw и vh. 1. Проценты: Проценты вычисляются относительно родительского элемента. Например, если у родительского элемента ширина 500px, а вы задаете дочернему элементу ширину 50%, то его ширина будет равна 250px (50% от 500px). Таким образом, при изменении ширины родительского элемента, размер дочернего элемента также будет изменяться пропорционально. 2. vw и vh: vw и vh...