Пример
Устанавливает свойство overflow в прокрутку:<html>
<head>
<meta charset="utf-8" />
<style>
div.scroll
{
background-color:#00FFFF;
width:100px;
height:100px;
overflow:scroll;
}
div.hidden
{
background-color:#00FF00;
width:100px;
height:100px;
overflow:hidden;
}
</style>
</head>
<body>
<p>Свойство overflow указывает, что делать если содержание элемента превышает размер окна элемента.</p>
<p>overflow:scroll</p>
<div class="scroll">Вы можете использовать свойство overflow когда вы хотите иметь больший контроль над макетом. Значение по умолчанию visible.</div>
<p>overflow:hidden</p>
<div class="hidden">Вы можете использовать свойство overflow когда вы хотите иметь больший контроль над макетом. Значение по умолчанию visible.</div>
</body>
</html>
Определение и использование
Свойство overflow указывает, что делать если содержание элемента превышает размер окна элемента.
| Значение по умолчанию: | visible |
|---|---|
| Унаследованный: | нет |
| Версия: | CSS2 |
| Синтакс JavaScript: | object.style.overflow="scroll" |
Поддержка браузеров
Свойство overflow поддерживается во всех ведущих браузерах.
Примечание: Ни одна из версий Internet Explorer (включая IE8) не поддерживает значение "inherit".
Значения свойства
| Значение | Описание |
|---|---|
| visible | Переполнение не обрезается. Оно выносится наружу элемента. Это по умолчанию |
| hidden | Переполнение обрезается, остаток содержания скрывается |
| scroll | Переполнение обрезается, но добавляется прокрутка для просмотра остатка содержания |
| auto | Если переполнение обрезается, то добавляется прокрутка для просмотра результатов скрытого содержания |
| inherit | Указывает, что значение свойства overflow должно быть унаследовано от родительского элемента |
Была ли эта информация полезной?
