Позиционирование на CSS для чайников, фиксированное и липкое позиционирование на CSS | Часть 2

YOUTUBE · 18.11.2025 17:27

Ключевые темы и таймкоды

Позишен фиксит и стики

0:01

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

Примеры использования позишен фиксит и стики

1:24

В примере с позишен фиксит, меню имеет фиксированное позиционирование, а текст скрыт под ним.
В примере со стики, элемент прилипает к верхней части экрана при скроллинге, а затем остается там, пока не будет достигнут другой элемент.

Поддержка позишен фиксит и стики

10:59

Глобальная поддержка позишен фиксит составляет 96%, а стики - 99%.
В некоторых браузерах, таких как Internet Explorer и Opera Mini, поддержка этих свойств может быть ниже.

Использование позишен стики для создания оглавления

12:08

Позишен стики можно использовать для создания оглавления, где заголовки прилипают к верхней части экрана и остаются там до тех пор, пока не будет достигнут следующий заголовок.

Позиционирование элементов

12:49

В видео рассматривается использование свойства позиционирования на CSS.
Обсуждаются различные варианты позиционирования элементов, включая использование дополнительной обертки для элементов.

Использование префиксов

15:20

В видео обсуждаются префиксы для свойств позиционирования, такие как "о" для Opera, "ms" для старых браузеров Microsoft, "moz" для старых версий Safari и "webkit" для старых версий Google Chrome.
Префиксы используются для поддержки старых браузеров и обеспечения корректной работы в них.

Использование дополнительных конструкций

16:42

В видео демонстрируется использование дополнительных конструкций для указания свойств позиционирования, таких как "собака" и "сапортс".
Эти конструкции позволяют указать действия, которые должны быть выполнены, если свойство поддерживается браузером.

Заключение

18:06

В видео подробно рассмотрены свойства позиционирования на CSS, включая позиционирование фиксированное, абсолютное и относительное, а также свойство позиционирования для изменения позиционирования.
Обсуждаются различные ситуации, в которых эти свойства могут быть использованы, и как они влияют на поведение элементов.