wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

Вопросы по HTML и CSS

Total questions: 131

Worksheet time: 2hrs 38mins

Name
Class
Date
1.

Что такое HTML?

a)

Язык программирования для создания игр

b)

Язык разметки для создания структуры веб-страницы

c)

Программа для редактирования фото

d)

Название социальной сети

2.

Какой тег создаёт заголовок самого верхнего уровня?

a)

heading

b)

h1

c)

head

d)

header

3.

Какой тег создаёт абзац?

a)

paragraph

b)

p

c)

para

d)

text

4.

Какой тег создаёт ссылку?

a)

link

b)

a

c)

href

d)

url

5.

Какие теги делают текст жирным и курсивным?

a)

bold и italic

b)

b и i

c)

strong и cursive

d)

fat и slant

6.

Что означает CSS?

a)

Computer Style System

b)

Cascading Style Sheets

c)

Creative Style Solutions

d)

Colorful Style Settings

7.

Как подключить CSS‑файл к HTML?

a)

style src="style.css"

b)

link rel="stylesheet" href="style.css"

c)

csstyle.css/css

d)

import css="style.css"

8.

Как изменить цвет текста в CSS?

a)

text-color: red;

b)

color: red;

c)

font-color: red;

d)

text: red;

9.

Как изменить размер текста?

a)

text-size: 16px;

b)

font-size: 16px;

c)

size: 16px;

d)

font: 16px;

10.

Как выровнять текст по центру?

a)

align: center;

b)

text-position: center;

c)

text-align: center;

d)

center: true;

11.

Какой тег создаёт нумерованный список?

a)

ul

b)

ol

c)

li

d)

list

12.

Какой тег создаёт маркированный список?

a)

ol

b)

ul

c)

li

d)

list

13.

Какой тег добавляет изображение на страницу?

a)

pic

b)

image

c)

img

d)

photo

14.

Как сделать, чтобы картинка была круглой?

a)

border-radius: 50%;

b)

round: yes;

c)

shape: circle;

d)

image-style: round;

15.

Какой тег создаёт элемент списка?

a)

item

b)

list-item

c)

li

d)

point

16.

Что такое класс в CSS?

a)

Школьный урок

b)

Стиль, который применяется к одному элементу

c)

Стиль, который можно применять к нескольким элементам

d)

Название школы

17.

Какой символ обозначает класс в CSS?

a)

#

b)

.

c)

!

d)

@

18.

Какой символ обозначает идентификатор в CSS?

a)

#

b)

.

c)

!

d)

@

19.

Для чего используется тег div?

a)

Для создания ссылок

b)

Для разделения страницы на блоки

c)

Для добавления картинок

d)

Для создания списков

20.

Как задать класс элементу в HTML?

a)

div id="my-class"

b)

div class="my-class"

c)

div #my-class

d)

div .my-class

21.

Как изменить фон элемента на красный?

a)

background-color: red;

b)

bg-color: red;

c)

color: red;

d)

back-color: red;

22.

Как сделать, чтобы элемент занимал всю ширину родителя?

a)

width: 100%;

b)

size: full;

c)

wide: yes;

d)

full-width: true;

23.

Как сделать скруглённые углы у кнопки?

a)

border-radius: 10px;

b)

round-corner: 10px;

c)

corner: round;

d)

button-style: round;

24.

Как создать красную точку размером 50×50 пикселей?

a)

div style="width: 50px; height: 50px; background: red; border-radius: 50%;"

b)

circle color="red" size="50"

c)

dot style="color: red; size: 50px"

d)

round style="background: red; diameter: 50px"

25.

Как сделать, чтобы элементы были в одной строке?

a)

display: inline; или display: inline-block;

b)

line: same;

c)

position: line;

d)

flow: horizontal;

26.

Какой тег создаёт статью или пост?

a)

article

b)

post

c)

story

d)

news

27.

Как сделать тень для блока с постом?

a)

block-shadow: 2px 2px 5px gray;

b)

shadow: 2px 2px 5px gray;

c)

box-shadow: 2px 2px 5px gray;

d)

element-shadow: 2px 2px 5px gray;

28.

Как сделать, чтобы у поста были отступы внутри?

a)

margin: 20px;

b)

padding: 20px;

c)

space: 20px;

d)

inside: 20px;

29.

Как сделать, чтобы у поста были отступы снаружи?

a)

margin: 20px;

b)

padding: 20px;

c)

space: 20px;

d)

outside: 20px;

30.

Как создать разделительную линию между постами?

a)

line

b)

hr

c)

break

d)

separator

31.

Какой тег создаёт навигационное меню?

a)

menu

b)

nav

c)

navigation

d)

links

32.

Как сделать, чтобы при наведении на пункт меню менялся цвет?

a)

a:hover { color: red; }

b)

a:over { color: red; }

c)

a:focus { color: red; }

d)

a:mouse { color: red; }

33.

Как сделать, чтобы меню было горизонтальным?

a)

display: flex;

b)

direction: horizontal;

c)

menu-style: line;

d)

layout: row;

34.

Как убрать подчёркивание у ссылок в меню?

a)

text-decoration: none;

b)

underline: no;

c)

link-style: clean;

d)

decoration: remove;

35.

Как сделать, чтобы меню было по центру страницы?

a)

text-align: center;

b)

margin: 0 auto;

c)

position: center;

d)

align: middle;

36.

Как изменить шрифт текста?

a)

text-font: Arial;

b)

font-family: Arial;

c)

font-style: Arial;

d)

font: Arial;

37.

Как добавить видео на страницу?

a)

movie

b)

video

c)

film

d)

media

38.

Как добавить аудио на страницу?

a)

music

b)

audio

c)

sound

d)

player

39.

Как сделать текст жирным с помощью CSS?

a)

font-weight: bold;

b)

text-bold: true;

c)

font-style: bold;

d)

weight: bold;

40.

Как сделать чтобы видео занимало всю ширину контейнера?

a)

width: 100%;

b)

video-size: full;

c)

size: max;

d)

full-width: true;

41.

Какой тег создает кнопку?

a)

button

b)

btn

c)

click

d)

press

42.

Как сделать чтобы элемент был невидимым?

a)

visibility: hidden; или display: none;

b)

see: no;

c)

hidden: true;

d)

opacity: zero;

43.

Как сделать градиентный фон?

a)

background: gradient(red, blue);

b)

background: linear-gradient(red, blue);

c)

bg-gradient: red to blue;

d)

color-mix: red blue;

44.

Как сделать чтобы при наведении появлялось подчеркивание?

a)

a:hover { text-decoration: underline; }

b)

a:over { underline: yes; }

c)

a:focus { line: under; }

d)

a:mouse { decoration: line; }

45.

Ты создал свою первую веб-страницу! Что ты скажешь?

a)

"Я молодец! Теперь я могу создавать сайты!"

b)

"Это было слишком сложно"

c)

"HTML и CSS - это скучно"

d)

"Лучше бы я играл в игры"

46.

Что такое IT?

a)

Информационные технологии

b)

Интересные техники

c)

Игральные таланты

d)

Индивидуальное творчество

47.

Какие профессии есть в IT?

a)

Программист, дизайнер, тестировщик

b)

Повар, строитель, врач

c)

Учитель, водитель, пилот

d)

Спортсмен, артист, музыкант

48.

Зачем нужно учиться в ИТ?

a)

Чтобы создавать полезные программы и сайты

b)

Чтобы научиться готовить

c)

Чтобы стать строителем

d)

Чтобы играть в игры

49.

Что такое Академия TOP?

a)

Место где учат IT-профессиям

b)

Горнолыжный курорт

c)

Музей технологий

d)

Спортивная школа

50.

Какие навыки развивают в ИТ?

a)

Логическое мышление и креативность

b)

Кулинарные способности

c)

Спортивные достижения

d)

Музыкальный слух

51.

Для чего нужна клавиша Enter?

a)

Для подтверждения действия или перехода на новую строку

b)

Для включения компьютера

c)

Для изменения цвета текста

d)

Для включения звука

52.

Что делает клавиша Backspace?

a)

Удаляет символ слева от курсора

b)

Создает новый документ

c)

Увеличивает шрифт

d)

Сохраняет файл

53.

Какие пальцы нужно использовать для печати?

a)

Все пальцы обеих рук

b)

Только указательные пальцы

c)

Только большие пальцы

d)

Только мизинцы

54.

Что такое «горячие клавиши»?

a)

Сочетания клавиш для быстрого выполнения команд

b)

Клавиши которые нагреваются при работе

c)

Клавиши красного цвета

d)

Клавиши для игр

55.

Какое сочетание копирует текст?

a)

Ctrl + C

b)

Ctrl + V

c)

Ctrl + Z

d)

Ctrl + X

56.

Что такое папка?

a)

Контейнер для хранения файлов и других папок

b)

Программа для рисования

c)

Устройство ввода информации

d)

Вид компьютерного вируса

57.

Как создать новую папку?

a)

Правой кнопкой мыши → Создать → Папку

b)

Нажать клавишу F1

c)

Закрыть все окна

d)

Перезагрузить компьютер

58.

Для чего нужен архиватор?

a)

Для сжатия файлов и уменьшения их размера

b)

Для удаления файлов

c)

Для изменения цвета файлов

d)

Для воспроизведения музыки

59.

Что такое расширение файла?

a)

Часть имени файла которая указывает на его тип

b)

Размер файла в мегабайтах

c)

Дата создания файла

d)

Цвет значка файла

60.

Какой программой открыть файл .zip?

a)

WinRAR или 7-Zip

b)

Блокнот

c)

Калькулятор

d)

Paint

61.

Что такое браузер?

a)

Программа для просмотра веб-страниц

b)

Программа для рисования

c)

Компьютерная игра

d)

Вид социальной сети

62.

Какой поисковик самый популярный?

a)

Google

b)

Яндекс

c)

Bing

d)

Yahoo

63.

Что такое Gmail?

a)

Электронная почта от Google

b)

Социальная сеть

c)

Облачное хранилище

d)

Видеохостинг

64.

Для чего нужен Google Диск?

a)

Для хранения файлов в интернете

b)

Для программирования

c)

Для создания музыки

d)

Для печати документов

65.

Что такое Google Аккаунт?

a)

Учетная запись для доступа к сервисам Google

b)

Банковский счет

c)

Игровой профиль

d)

Музыкальный альбом

66.

Как поделиться документом с другом?

a)

Нажать кнопку «Поделиться» и ввести email

b)

Распечатать и отдать лично

c)

Переименовать документ

d)

Сделать скриншот

67.

Как изменить шрифт текста?

a)

Выделить текст и выбрать шрифт в панели инструментов

b)

Перезагрузить страницу

c)

Создать новый документ

d)

Поменять фон документа

68.

Что такое «режим предложений»?

a)

Режим когда другие могут предлагать правки

b)

Режим только для чтения

c)

Режим печати

d)

Режим программирования

69.

Как вставить таблицу в документ?

a)

Вставка → Таблица

b)

Файл → Создать таблицу

c)

Правка → Нарисовать таблицу

d)

Вид → Показать таблицу

70.

Как добавить комментарий к тексту?

a)

Выделить текст и нажать «Добавить комментарий»

b)

Написать комментарий в заголовке

c)

Изменить цвет текста

d)

Создать новый документ

71.

Что такое ячейка в таблице?

a)

Пересечение строки и столбца

b)

Заголовок таблицы

c)

Формула расчета

d)

Цвет фона

72.

Как посчитать сумму чисел в столбце?

a)

Использовать функцию SUM

b)

Перемножить все числа

c)

Написать текст «сумма»

d)

Изменить шрифт

73.

Как создать диаграмму?

a)

Вставка → Диаграмма

b)

Файл → Новая диаграмма

c)

Правка → Нарисовать диаграмму

d)

Формат → Цвет диаграммы

74.

Что такое фильтр в таблице?

a)

Инструмент для отображения только нужных данных

b)

Инструмент для изменения цветов

c)

Инструмент для печати

d)

Инструмент для программирования

75.

Как закрепить строку заголовков?

a)

Вид → Закрепить → 1 строку

b)

Формат → Скрыть строку

c)

Правка → Удалить строку

d)

Файл → Заблокировать строку

76.

Что такое слайд?

a)

Одна страница презентации

b)

Анимация перехода

c)

Фон презентации

d)

Шрифт текста

77.

Как добавить новый слайд?

a)

Вставка → Новый слайд

b)

Файл → Новая презентация

c)

Правка → Копировать слайд

d)

Вид → Показать слайды

78.

Как добавить анимацию к объекту?

a)

Нажать «Добавить анимацию»

b)

Изменить цвет объекта

c)

Удалить и создать заново

d)

Переименовать объект

79.

Как изменить фон слайда?

a)

Правой кнопкой мыши → Изменить фон

b)

Удалить все объекты

c)

Создать новый слайд

d)

Изменить шрифт заголовка

80.

Как запустить показ презентации?

a)

Нажать «Показ» или F5

b)

Закрыть презентацию

c)

Распечатать слайды

d)

Поделиться с другом

81.

Что такое Figma?

a)

Программа для дизайна интерфейсов

b)

Программа для программирования

c)

Социальная сеть

d)

Музыкальный редактор

82.

Какой инструмент рисует прямоугольники?

a)

Rectangle (R)

b)

Pen (P)

c)

Text (T)

d)

Hand (H)

83.

Как добавить текст в Figma?

a)

Инструмент Text (T)

b)

Инструмент Pen (P)

c)

Инструмент Line (L)

d)

Инструмент Ellipse (O)

84.

Как изменить цвет фигуры?

a)

В панели Fill

b)

В панели Text

c)

В панели Effects

d)

В панели Export

85.

Как выровнять несколько объектов?

a)

Использовать панель выравнивания

b)

Перемещать мышкой

c)

Удалить и создать заново

d)

Изменить их размер

86.

Что такое прототип?

a)

Интерактивная модель будущего сайта

b)

Финальная версия сайта

c)

Исходный код сайта

d)

Фотография сайта

87.

Как создать связь между фреймами?

a)

В режиме Prototype потянуть связь между объектами

b)

Скопировать фрейм

c)

Изменить название фрейма

d)

Удалить фрейм

88.

Что такое компонент в Figma?

a)

Пересопользуемый элемент дизайна

b)

Фоновая картинка

c)

Цветовая палитра

d)

Шрифт текста

89.

Как проверить работу прототипа?

a)

Нажать кнопку Present

b)

Сохранить файл

c)

Экспортировать картинки

d)

Поделиться ссылкой

90.

Для чего нужны сетки в Figma?

a)

Для выравнивания элементов

b)

Для изменения цветов

c)

Для добавления анимации

d)

Для программирования

91.

Что такое лендинг?

a)

Одностраничный сайт

b)

Многостраничный сайт

c)

Интернет-магазин

d)

Социальная сеть

92.

Какой блок используется для заголовка?

a)

Cover

b)

Grid

c)

Form

d)

Gallery

93.

Как добавить кнопку на Tilda?

a)

Блок Button

b)

Блок Text

c)

Блок Image

d)

Блок Line

94.

Как опубликовать сайт на Tilda?

a)

Нажать кнопку «Опубликовать»

b)

Сохранить проект

c)

Закрыть браузер

d)

Удалить все блоки

95.

Какое свойство стилей задает цвет фона блока?

a)

color

b)

background

c)

background-color

d)

color-background

96.

Какое свойство стилей задает цвет шрифта?

a)

font-color

b)

font

c)

color

d)

colorful

97.

Какое свойство позволяет указать размер шрифта?

a)

size

b)

font-weight

c)

font-size

d)

font-grow

98.

Какое свойство

позволяет форматировать шрифт текста полужирным начертанием

a)

font-weight

b)

font-bold

c)

font-style

d)

font-size

99.

Какой псевдокласс позволяет применять стили при наведении мышкой

a)

:after

b)

:link

c)

:hover

d)

:first-line

100.

Какое свойство отвечает за ширину блока

a)

width

b)

height

c)

size

d)

div

101.

Какое свойство позволя­ет одновременно указать толщину, стиль и цвет границы.

a)

borders

b)

padding

c)

margin

d)

border

102.

Какое свойство по­зволяет указать, сколько места между содержимым элемента и его границами (внутренние отступы).

a)

margin

b)

width

c)

padding-width

d)

padding

103.

Какое свойство позволяет закруглять углы блоков

a)

border-circle

b)

border

c)

border-radius

d)

border-image

104.

Какое свойство отвечает за высоту блока

a)

width

b)

heights

c)

height

d)

postion

105.

Какое свойство определя­ет интервал между блоками (внешние отступы)

a)

margin

b)

padding

c)

position

d)

width

106.

Какое свойство позволя­ет выбрать вид указателя мыши

a)

mouse

b)

outline

c)

cursor

d)

image

107.

Какое свойство позволяет поместить изображение позади любого НТМL-элемента (как фоновое изображение)

a)

background-image

b)

background-color

c)

background-size

d)

background-position

108.

Что такое CSS?

a)

Creative Style Sheets

b)

Cascading Style Sheets

c)

Computer Style Sheets

d)

Colorful Style Sheets

109.

Для чего нужен CSS?

a)

Для работы со стилями в фреймах

b)

Для создания разметки на странице

c)

Для работы со стилями на страницах сайта

d)

Для добавления функциональности к странице

110.

Какое правило CSS написано корректно?

a)

{ a:color=red; }

b)

a [ color: red; ]

c)

a { color = red; }

d)

a { color: red; }

111.

Как изменить цвет фона для всех элементов h1 на странице?

a)

h1 {background-color: #ccc;}

b)

h1[all] {background-color: #ccc;}

c)

h1.all {background-color: #ccc;}

d)

h1:all {background-color: #ccc;}

112.

Где верно прописан селектор для тега ниже?

<div id="test">Text</div>

a)

.test {}

b)

div.test {}

c)

#test {}

d)

* {}

113.

Как много стилей можно добавить к одному объекту?

a)

Не более 20

b)

В промежутке от 1 до 30

c)

Не более 50

d)

Неограниченное количество

114.

Как к тегу «P» добавить несколько классов?

a)

К одному элементу можно добавить лишь один класс

b)

Можно записать несколько классов через точку: test-1.test-2

c)

Необходимо дважды прописать атрибут class для тега

d)

Необходимо прописать классы через пробел: class="test-1 test-2"

115.

Укажите основное назначение тега div?

a)

Для блочной верстки сайта

b)

Для табличной верстки сайта

c)

Для работы с видео

d)

Для создание таблиц

116.

Какой тэг используется для размещения меню?

a)

<nav>

b)

<geo>

c)

<metanav>

117.

Какие из перечисленных тэгов используются для разбивки документа на блоки?

a)

<header>

b)

<bottom>

c)

<section>

d)

<aside>

e)

<p>

118.

Укажите, какой из перечисленный стилей позволяет получить результат, показанный на рисунке?

a)
b)
c)
d)
119.

Как подключить внешние стили (например style.css) к html-документу

a)

<link rel="stylesheet" type="text/css" href="style.css">

b)

<img rel="stylesheet" type="text/css" src="style.css">

c)

<link rel="stylesheet" type="text/css">

d)

<css rel="stylesheet" type="text/css" href="style.css">

120.

Свойство position:fixed

a)

делает элемент родителем

b)

делает его самим по себе

c)

фиксирует элемент в конкретном месте

d)

ничего не происходит

121.

Где верно прописан селектор для тега ниже?

<div class="test">Text</div>

a)

.test {}

b)

div.test {}

c)

#test {}

d)

* {}

122.

Какой HTML-тег используется для установления внутренней таблицы стилей ( Internal style sheet)?

a)

<style>

b)

<css>

c)

<script>

123.

Как добавить комментарий в CSS файле?

a)

/* Это комментарий */

b)

// Это комментарий

c)

// Это комментарий //

d)

<!-- Это комментарий -->

124.

Какое расширение имеют css-файлы?

a)

.css

b)

.style

c)

.html

125.

Какой цвет шрифта будет у абзаца?

a)

Зеленый цвет

b)

Синий цвет

c)

Красный цвет

d)

По умолчанию черный цвет текста.

126.

Какое свойство определяет расположение картинки

a)

background-image

b)

background-position

c)

background-color

d)

background-repeat

127.

Что произойдет с изображением при заданных свойствах

div {

background-repeat: repeat-y; }

a)

изображение будет повторяться по горизонтали

b)

изображение будет повторяться по вертикали

c)

будет расположено в центре

d)

будет расположено внизу экрана

128.

Какое значение необходимо задать чтобы изображение повторялось по горизонтали

a)

repeat-y

b)

repeat-x

c)

repeat

129.

Какой тег используется для создания ссылки?

a)

url

b)

link

c)

href

d)

a

130.

Как задать высоту элемента в CSS?

a)

height: 100px;

b)

size: 100px;

c)

tall: 100px;

d)

vertical: 100px;

131.

Как сделать текст выравненным по центру?

a)

justify: center;

b)

align: center;

c)

text-align: center;

d)

center: true;

Similar Resources on Wayground