Свойство overflow

Свойство overflow определяет поведение блокового элемента (p, div или элементов заголовка), когда размеры его содержимого не соответствуют размерам фрейма, установленного свойствами width и height (см. 4.3.17.2.4).

По умолчанию (значение visible) выполняется сжатие или увеличение содержимого элемента таким образом, чтобы он полностью отобразился во фрейме. Если же задано значение hidden, то производится обрезание элемента в соответствии с заданными размерами, начиная с левого верхнего угла. В этом случае невидимая часть содержимого блокового элемента недоступна.

Два значения auto и scroll задают вывод полос прокрутки для блока с заданными значениями свойств width и height. Если задано значение auto, то полосы прокрутки добавляются к блоку отображения только в том случае, если размеры содержимого элемента превосходят размеры блока отображения. При значении scroll полосы прокрутки всегда добавляются к блоку отображения.

Если для блокового элемента задано свойство overflow, но не заданы значения width и height, то, независимо от значения свойства, блоковый элемент выводится так, как если бы значение свойства overflow было равно visible. Размер фрейма для элемента, так же как и для внутреннего фрейма с использованием элемента iframe, изменить нельзя.

Для блокового элемента со свойством overflow можно, как и для внутреннего фрейма (см. 4.3.25.1), можно задавать свойства блоковой модели документа.

«Обтекание» блокового элемента, для которого задано свойство overflow, выполняется с помощью свойства float (см. 4.3.17.2.1), а прерывание «обтекания» – с помощью свойства clear (см. 4.3.17.2.2).

 

Пример 4.3.103. Использование свойства overflow:

#pflow {

width: 200px; height: 550px;overflow: scroll;

border:10pt fuchsia outset;

margin:20px; padding:20px; text-align: justify;

}

…

 

<p>Текст перед фреймом</p>

<div id="pflow">

<!-- Содержимое элемента div -->

</div>

<p>Текст после фрейма</p>

Вывод на экран этого фрагмента Web-страницы будет иметь следующий вид: