Bootstrap 5-позиционный липкий верх

Bootstrap 5 Position Sticky top используется для установки позиции элемента в Sticky top окна просмотра, когда пользователь прокручивает вниз. Класс .sticky-top использует свойство position: sticky, которое не полностью поддерживается всеми браузерами. Мы можем использовать некоторое свойство CSS, чтобы отобразить эффект фиксированного положения дна.

Позиция Sticky Top Class:

• sticky-top: этот класс используется для установки положения элемента в липкой верхней части области просмотра, когда пользователи прокручивают страницу вниз.

Синтаксис:

<div class="sticky-top">
    Content
</div>

Пример 1. В этом примере мы создадим элемент div фиксированной ширины и высоты и установим его класс на sticky-top, чтобы сделать div прикрепленным вверху страницы.

Выход:

Пример 2. В этом примере мы создадим элемент изображения фиксированной ширины и высоты и установим его класс на sticky-top, чтобы изображение прикреплялось к верхней части страницы.

Выход:

Ссылка: https://getbootstrap.com/docs/5.0/helpers/position/#sticky-top