Для того чтобы сделать так, чтобы при уменьшении длины страницы длина блока также уменьшалась, можно использовать относительные единицы измерения в CSS, такие как проценты или единицы vh (viewport height).
Например, если вы хотите, чтобы блок занимал 50% ширины окна просмотра, вы можете использовать следующий CSS код:
.block {
width: 50%;
}
Таким образом, при изменении ширины страницы блок будет автоматически занимать 50% доступной ширины.
Если же вам необходимо уменьшать высоту блока при уменьшении длины страницы, вы можете использовать единицы vh. Например, для блока, который должен занимать 50% высоты окна просмотра, можно использовать следующий CSS код:
.block {
height: 50vh;
}
Таким образом, высота блока будет равна 50% высоты окна просмотра и будет автоматически уменьшаться при уменьшении высоты страницы.
Использование относительных единиц измерения в CSS позволяет создавать адаптивные дизайны, которые подстраиваются под размеры экрана устройства пользователя, что очень важно для создания интерфейсов, работающих на широком спектре устройств.