Переполнение

Итак, предположим, что для некоторого элемента задан определенный размер и содержимое в него не помещается. Ситуацию можно взять под контроль посредством свойства overflow. Применяемое по умолчанию значение visible означает, что содержимое элемента будет видимым вне блока элемента. Обычно содержимое при этом просто выходит за границы собственного блока элемента, но не меняет форму этого блока:

div#sidebar {position: absolute; top: 0; left: 0; width: 25%; height: 7em;
background: #BBB; overflow: visible;}

Если для свойства overflow задано значение scroll, содержимое отсекается – т. е. его нельзя увидеть – краями блока элемента, но есть возможность сделать непоместившееся содержимое доступным пользователю. В веб-броузере это могло бы означать появление полосы прокрутки (или набора полос прокрутки) или другого средства доступа к содержимому без изменения формы самого элемента:

div#sidebar {position: absolute; top: 0; left: 0; width: 15%; height: 7em;
overflow: scroll;}

Если задано значение scroll, то механизмы панорамирования (например, полосы прокрутки) должны генерироваться всегда. Цитируем спецификацию: «этим устраняются любые проблемы с появлением или исчезновением полос прокрутки в динамической среде».


Таким образом, даже если места для отображения всего содержимого элемента достаточно, полосы прокрутки все равно должны появляться. Кроме того, при распечатке страницы или любом другом представлении документа в печатающем устройстве содержимое может отображаться так, как если бы для свойства overflow было задано значение visible.

Если для свойства overflow задано значение hidden, то содержимое элемента отсекается краями блока элемента и интерфейс прокрутки не предоставляется (чтобы содержимое, оказавшееся вне области отсечения, было доступно пользователю). Рассмотрим следующую разметку:

div#sidebar {position: absolute; top: 0; left: 0; width: 15%; height: 7em;
overflow: hidden;}

В подобном случае отсеченное содержимое не будет доступно пользователю. И наконец, есть вариант значения overflow: auto. Если оно задано, то агенты пользователя могут сами определять, какое поведение выбрать, хотя им предлагается в случае необходимости предоставлять механизм прокрутки. Это перспективный способ устранения трудностей, связанных с переполнением, поскольку агенты пользователя могли бы интерпретировать это, как «предоставлять полосы прокрутки только в случае необходимости» (Не исключено, что они этого не делают, но, определенно, могли бы и, вероятно, должны.)

Оцените статью: (0 голосов)
0 5 0

Статьи из раздела CSS на эту тему:
Блок-контейнер
Блоки-контейнеры и абсолютно позиционированные элементы
Видимость элементов
Задание ширины и высоты
Запрет на обтекание