CSS свойство scroll-behavior

  • предыдущая страница @scope
  • Следующая страница scroll-margin

Определение и использование

Атрибут scroll-behavior определяет, будет ли выполняться плавное (с анимацией) прокрутка при клике по ссылке в рамке прокрутки, а не прямое перемещение.

Пример

Добавить плавную прокрутку документа:

html {
  scroll-behavior: smooth;
}

Попробуйте сами

CSS синтаксис

scroll-behavior: auto|smooth|initial|inherit;

Значение атрибута

Значение Описание
auto по умолчанию. Разрешает прямое перемещение элементов внутри рамки прокрутки.
smooth Разрешает平稳ное «перемещение» элементов внутри рамки прокрутки.
initial Установить этот атрибут в его значение по умолчанию. См. также initial.
inherit Ингеренция из родительского элемента. См. также inherit.

Технические детали

по умолчанию: auto
Ингеренция: нет
Создание анимации: Не поддерживается. См. также:Свойства анимации.
Версия: CSSOM View Module (работающий проект)
JavaScript синтаксис: object.style.scrollBehavior="smooth"

поддержка браузерами

Числа в таблице указывают на первую версию браузера, которая полностью поддерживает этот атрибут.

Chrome IE / Edge Firefox Safari Opera
61.0 79.0 36.0 14.0 48.0
  • предыдущая страница @scope
  • Следующая страница scroll-margin