css властивість overflow-y


Властивість overflow-y вказує, що зробити для переповненого по вертикалі елемента:

  • Обрізати вміст, що поза межами елемента, без можливості його перегляду.
  • Показати вміст, що поза межами елемента.
  • Обрізати вміст, що поза межами елемента та для можливості перегляду обрізаного тексту, показати горизонтальну смугу прокручування.

В стані чернетки, існують три ключові слова, які можна буде використовувати в якості значень для overflow: no-display, no-content, clip.

Для того, щоб побачити результат дії overflow-y, разом з ним для елементу треба прописати також висоту(height або max-height), або задати значення nowrap для white-space.

Ви можете також використовувати властивість overflow для скороченого запису overflow-x i overflow-y.

Синтаксис

overflow-y: visible|hidden|scroll|auto|initial|inherit;

Властивість overflow-y може отримувати 6 значень:

visible

Відображає ввесь вміст елемента, навіть вміст, що за межами елемента. Без задання.

hidden

Відображається лише область всередині елемента, все, що поза межами контейнера, буде обрізано.

scroll

Вертикальна смуга прокручування буде завжди відображена.

auto

Вертикальна смуга прокручування з'явиться, тільки при необхідності.

initial

Встановлює властивість у значення без задання

inherit

Вказує на спадковість властивості від свого батьківського елемента.

Значення без задання: visible
Наслідує: Ні
Анімується: Ні
JavaScript синтаксис: object.style.overflowY="scroll"

Переглядачі

Переглядач
overflow-y

4.0

9.0

3.5

3.0

9.5

Переглядач
overflow-y

1.0

1.0

3.0


Мобільних переглядачів ще не додано.

Приклади


Динамічний приклад

Демонстрація роботи властивості

Приклад використання властивості overflow-y.

Обрізання вмісту в елементі <div>

div {


    overflow-y: hidden;


}


Додаткові посилання