Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Вивчайте Виклик: Опанування Фіксованого Позиціонування зі Зсувом | Володіння Позиціонуванням у CSS
Просунуті техніки CSS

bookВиклик: Опанування Фіксованого Позиціонування зі Зсувом

Завдання

Створити макет блогу для статей про тварин, забезпечивши постійну видимість відповідної фотографії тварини під час читання статті. Коли користувач починає читати про іншу тварину, показувати наступну фотографію тварини. Кроки:

  1. Застосувати позиціонування sticky до елемента з класом illustration.
  2. Вказати позицію на сторінці, де елемент має стати "липким".
index.html

index.html

index.css

index.css

copy
  1. Щоб ілюстрації тварин залишалися прикріпленими до верхньої частини вікна перегляду під час читання статті, застосуйте позиціонування sticky до елемента з класом illustration.
  2. Встановіть властивість top у значення 0, щоб елемент залишався прикріпленим до верхньої частини вікна перегляду.
index.html

index.html

index.css

index.css

copy

Все було зрозуміло?

Як ми можемо покращити це?

Дякуємо за ваш відгук!

Секція 2. Розділ 9

Запитати АІ

expand

Запитати АІ

ChatGPT

Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат

Awesome!

Completion rate improved to 2.04

bookВиклик: Опанування Фіксованого Позиціонування зі Зсувом

Свайпніть щоб показати меню

Завдання

Створити макет блогу для статей про тварин, забезпечивши постійну видимість відповідної фотографії тварини під час читання статті. Коли користувач починає читати про іншу тварину, показувати наступну фотографію тварини. Кроки:

  1. Застосувати позиціонування sticky до елемента з класом illustration.
  2. Вказати позицію на сторінці, де елемент має стати "липким".
index.html

index.html

index.css

index.css

copy
  1. Щоб ілюстрації тварин залишалися прикріпленими до верхньої частини вікна перегляду під час читання статті, застосуйте позиціонування sticky до елемента з класом illustration.
  2. Встановіть властивість top у значення 0, щоб елемент залишався прикріпленим до верхньої частини вікна перегляду.
index.html

index.html

index.css

index.css

copy

Все було зрозуміло?

Як ми можемо покращити це?

Дякуємо за ваш відгук!

Секція 2. Розділ 9
some-alt