Чтобы использовать CSS-свойство scroll-behavior для создания плавного скроллинга, нужно: 15

1. Добавить якорную ссылку на странице. 1 Для этого нужно найти ссылку, которую планируется использовать для действия, и назначить параметру href хэштег (#) с идентификатором элемента страницы, где должна останавливаться прокрутка. 1 Например: <a href='#myelement'>click here to scroll to 'myelement'</a>. 1
2. Создать элемент конечной точки плавной прокрутки. 1 Для этого нужно назначить атрибут id элементу, в котором должна останавливаться плавная прокрутка. 1 Важно дать ему то же имя, что и ранее использовалось в теге якорной ссылки, но без «#» в значении id. 1 Например: <div class='whatever' id='myelement'></div>. 1
3. Добавить CSS-анимацию с помощью scroll-behavior. 1 Для этого нужно добавить в основной файл CSS сайта строку: html{ scroll-behavior: smooth; }. 1 Важно добавить стиль scroll-behavior к тегу html, чтобы эффект плавной прокрутки распространялся на весь сайт. 1

После сохранения изменений и перезагрузки CSS в браузере плавная прокрутка будет включена. 1

Свойство scroll-behavior работает почти со всеми популярными браузерами: Google Chrome, Firefox, Safari и Opera. 5 Исключение — Internet Explorer и старые версии браузеров. 5