Стилізація веб-сторінок з CSS

Додано: 11 грудня 2025
Предмет: Інформатика, 11 клас
12 запитань
Запитання 1

Який атрибут використовується для підключення зовнішнього файлу стилів (CSS) у тегу <link>?

варіанти відповідей

href

src

style

link

Запитання 2

Як у CSS звернутися до елемента, що має id="header"?

варіанти відповідей

.header

*header

#header

header

Запитання 3

Яка властивість відповідає за внутрішній відступ елемента (відстань від вмісту до межі)?

варіанти відповідей

margin

border

padding

spacing

Запитання 4

Що станеться з текстом, якщо застосувати властивість color: red;?

варіанти відповідей

Текст стане чорним.

Текст стане червоним.

Фон стане червоним.

Рамка стане червоною.

Запитання 5

У блоковій моделі (Box Model) властивість border розташована між:

варіанти відповідей

margin та padding

Вмістом (content) та padding

margin та сусіднім елементом

Вмістом (content) та фоном

Запитання 6

Яку властивість потрібно задати батьківському елементу, щоб перетворити його на Flex-контейнер?

варіанти відповідей

display: block;

display: flex;

position: flex;

flex-direction: row;

Запитання 7

Яка властивість Flexbox дозволяє вирівняти елементи вздовж головної осі (горизонтально за замовчуванням)?

варіанти відповідей

align-items

justify-content

flex-wrap

align-content

Запитання 8

Для чого використовуються медіа-запити (@media) в CSS?

варіанти відповідей

Для додавання відео на сторінку.

Для створення анімацій.

Для застосування різних стилів залежно від параметрів пристрою (наприклад, ширини екрана).

Для підключення шрифтів.

Запитання 9

Які з наведених варіантів є валідними способами задання кольору в CSS? (декілька правильних відповідей)

варіанти відповідей

color: red;

color: #ff0000;

color: 255, 0, 0;

color: rgb(255, 0, 0);

color: 100%;

Запитання 10

Оберіть властивості, які є частиною блокової моделі (Box Model). (декілька правильних відповідей)

варіанти відповідей

padding

font-size

margin

border

background-color

Запитання 11

Які значення може приймати властивість flex-direction? (декілька правильних відповідей)

варіанти відповідей

row

center

column

justify

space-between

Запитання 12

Які умови можна перевірити за допомогою медіа-запитів? (декілька правильних відповідей)

варіанти відповідей

min-width (мінімальна ширина екрана)

battery-level (рівень заряду батареї)

orientation (орієнтація пристрою: книжкова/альбомна) 

user-name (ім'я користувача)

Створюйте онлайн-тести
для контролю знань і залучення учнів
до активної роботи у класі та вдома

Створити тест