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

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

Завдання

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

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

index.html

index.css

index.css

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

index.html

index.css

index.css

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

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

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

Секція 3. Розділ 6

Запитати АІ

expand

Запитати АІ

ChatGPT

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

Awesome!

Completion rate improved to 2.5

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

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

Завдання

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

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

index.html

index.css

index.css

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

index.html

index.css

index.css

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

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

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

Секція 3. Розділ 6
some-alt