Завдання: Впровадження Декоративних Ефектів у CSS
Завдання
Практичне застосування та покращення візуальної привабливості веб-сторінки. Завдання включає:
- Додати тінь до елемента
divз класомcard. Вказані значення тіні:rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px. - Додати фонове зображення до елемента
divз класомcard. Посилання на зображення:https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/css-fundamentals/decorative-effects/challenge-background.png. - Вирівняти фонове зображення по центру в межах картки.
index.html
index.css
- Для додавання тіні до елемента використовуйте властивість
box-shadowіз зазначеним значенням. У цьому випадку значення:rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px. - Для встановлення зображення як фону за допомогою властивості
background-imageзастосовуйте синтаксисurl("correct path"). У дужках відкрийте лапки та вкажіть шлях до зображення. У цьому завданні правильний шлях:url("https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/css-fundamentals/decorative-effects/challenge-background.png"). - Для визначення позиції фонового зображення використовуйте властивість
background-position. У цьому випадку значення властивості —center.
index.html
index.css
Примітка
Ви завершили курс "Основи CSS" та опанували базові принципи стилізації веб-сторінок. Далі вдосконалюйте свої дизайнерські навички з "Розширені техніки CSS", або починайте вивчати інтерактивність у "Вступ до JavaScript". Ваш шлях веб-розробника триває!
1. Яка властивість додає тінь навколо блоку елемента?
2. Як додати зображення як фон елемента?
Дякуємо за ваш відгук!
Запитати АІ
Запитати АІ
Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат
How do I write the CSS code to add the shadow and background image to the card?
Can you explain where to place the CSS code for the .card class?
What does the box-shadow property do in this context?
Awesome!
Completion rate improved to 2.56Завдання: Впровадження Декоративних Ефектів у CSS
Свайпніть щоб показати меню
Завдання
Практичне застосування та покращення візуальної привабливості веб-сторінки. Завдання включає:
- Додати тінь до елемента
divз класомcard. Вказані значення тіні:rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px. - Додати фонове зображення до елемента
divз класомcard. Посилання на зображення:https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/css-fundamentals/decorative-effects/challenge-background.png. - Вирівняти фонове зображення по центру в межах картки.
index.html
index.css
- Для додавання тіні до елемента використовуйте властивість
box-shadowіз зазначеним значенням. У цьому випадку значення:rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px. - Для встановлення зображення як фону за допомогою властивості
background-imageзастосовуйте синтаксисurl("correct path"). У дужках відкрийте лапки та вкажіть шлях до зображення. У цьому завданні правильний шлях:url("https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/css-fundamentals/decorative-effects/challenge-background.png"). - Для визначення позиції фонового зображення використовуйте властивість
background-position. У цьому випадку значення властивості —center.
index.html
index.css
Примітка
Ви завершили курс "Основи CSS" та опанували базові принципи стилізації веб-сторінок. Далі вдосконалюйте свої дизайнерські навички з "Розширені техніки CSS", або починайте вивчати інтерактивність у "Вступ до JavaScript". Ваш шлях веб-розробника триває!
1. Яка властивість додає тінь навколо блоку елемента?
2. Як додати зображення як фон елемента?
Дякуємо за ваш відгук!
