Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Челендж: Структурні Псевдокласи | Бокс Модель та Відстань між Елементами
Основи CSS
course content

Зміст курсу

Основи CSS

Основи CSS

2. CSS для Тексту
3. Бокс Модель та Відстань між Елементами
4. Флексбокс
5. Декоративні Ефекти

Челендж: Структурні Псевдокласи

Завдання

Ми працюємо з набором елементів, і наша мета - попрактикуватися у застосуванні різних кольорів за допомогою структурних псевдокласів. Ваше завдання полягає в наступному:

  • Застосуйте колір red до першого елементу з допомогою структурного псевдокласу.
  • Застосуйте колір blue до останнього елементу з допомогою структурного псевдокласу.
  • Застосуйте колір зелений до кожного другого елементу, використовуючи структурний псевдоклас.
html

index

css

index

js

index

  • :first-child: Спрямований на перший дочірній елемент батьківського елемента.
  • :last-child: Обирає останнього дочірнього елемента батьківського елемента.
  • :nth-child(): Вибирає певний дочірній елемент батьківського елемента на основі його позиції у списку. Наприклад, щоб вибрати кожен другий елемент списку (2, 4, 6 і т.д.), ви можете використовувати :nth-child(2n).
html

index

css

index

js

index

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

Секція 3. Розділ 6
We're sorry to hear that something went wrong. What happened?
some-alt