Как сделать скролл в html
Ответы
Вячеслав Межуревский
01 ноября 2022
Для создания блока фиксированного размера с возможностью прокрутки по горизонтали и вертикали необходимо использовать свойство overflow.
Overflow может принимать следующие значения:
- visible: По умолчанию. Содержимое не обрезается, может отображаться снаружи блока, в котором оно расположено.
- hidden: Контент обрезается, без предоставления прокрутки.
- scroll: Содержимое обрезается и браузер использует элементы прокрутки, не важно было ли обрезано содержимое или нет. Это избегает многих проблем касательно появления прокруток и их исчезновения в динамичной среде. Принтеры могут печатать переполненное содержимое.
- auto: Зависит от агента пользователя. Браузеры такие как Firefox предоставляют прокрутку, если содержимое переполняет блок.
Рассмотрим пример.
Исходный HTML документ:
<div>
Пример текста, который будет в блоке с полосами прокрути - как
горизонтальной так и вертикальной. Для того что бы ими можно было
воспользоваться, добавим д____л____и____н____н____о_____е слово.
</div>
Стили:
div {
border: 1px solid #000;
width: 200px;
height: 50px;
/* Включаем отображение полос прокрутки по горизонтали
и по вертикали */
overflow: auto;
padding: 20px;
}
Результат:
0
0