Font size
WorksheetsВопросы по CSS и HTML
Total questions: 60
Worksheet time: 23mins
Какой селектор выберет все элементы с классом "highlight"?
.highlight
#highlight
*highlight
highlight
Какое свойство используется для установки высоты строки?
line-height
font-size
letter-spacing
word-spacing
Что такое padding?
Внутреннее пространство элемента
Внешнее пространство элемента
Размер границы элемента
Размер содержимого элемента
Какое значение свойства position создает элемент, который позиционируется относительно ближайшего позиционированного предка?
static
relative
absolute
fixed
Какое свойство используется для определения направления главной оси в Flex контейнере?
flex-direction
flex-wrap
justify-content
align-items
Какой псевдокласс используется для выбора элемента, когда курсор мыши находится над ним?
:hover
:active
:focus
:visited
Какое свойство используется для определения точки разрыва для медиа-запросов?
breakpoint
media-query
viewport
screen-size
Как выровнять элементы по главной оси, чтобы они были распределены равномерно по доступному пространству?
justify-content: center;
justify-content: space-between;
justify-content: space-around;
justify-content: space-evenly;
В чем основное отличие между относительным и абсолютным позиционированием?
Относительное позиционирование всегда относительно родительского элемента, а абсолютное - относительно ближайшего позиционированного предка.
Относительное позиционирование сдвигает элемент относительно его начального положения, а абсолютное - полностью игнорирует поток документа.
Нет существенной разницы.
Относительное позиционирование используется только для блочных элементов, а абсолютное - для строчных.
Какое из следующих утверждений о повышении производительности веб-страниц верно?
Чем больше медиа-запросов, тем лучше.
Использование внешних стилей и скриптов всегда лучше, чем встроенных.
Минимизация и сжатие файлов CSS и JS могут улучшить скорость загрузки страницы.
Использование фреймов повышает скорость отображения контента.
В чем преимущество использования юнита em перед px для шрифтов?
em привязан к размеру шрифта родительского элемента, что делает шрифт более гибким.
em всегда дает фиксированный размер шрифта.
em не поддерживается всеми браузерами.
em сложнее использовать в расчетах.
Как выровнять элементы по вертикали в центре контейнера с помощью Flexbox?
align-items: center;
justify-content: center;
align-content: center;
vertical-align: middle;
Для чего используются имена областей в Grid?
Для более гибкого позиционирования элементов внутри сетки.
Для создания сложных анимаций.
Для улучшения производительности.
Только для декоративных целей.
Какое из следующих утверждений о повышении производительности веб-страниц верно?
Использование минификации и сжатия файлов CSS и JS не оказывает существенного влияния на скорость загрузки страницы.
Асинхронная загрузка скриптов всегда лучше, чем синхронная.
Как изменить порядок следования элементов внутри Flex контейнера?
Использовать свойство order.
Изменить порядок элементов в HTML.
Использовать свойство flex-direction.
Это невозможно сделать с помощью Flexbox.
<li>ПЕРВЫЙ</li>
<li>ВТОРОЙ</li>
<li>ТРЕТИЙ</li>
</ul>
<li>ПЕРВЫЙ</li>
<li>ВТОРОЙ</li>
<li>ТРЕТИЙ</li>
</ol>
p {
color: red;
}
</style>
Сколько существует способов добавления стилей на сайт?
1
2
3
4
Можно ли добавлять стили как атрибут к определенному тегу?
Да
Нет
Как подключить внешние стили (например style.css) к html-документу
<link rel="stylesheet" type="text/css" href="style.css">
<img rel="stylesheet" type="text/css" src="style.css">
<link rel="stylesheet" type="text/css">
<css rel="stylesheet" type="text/css" href="style.css">
Сколько существует тегов для создания структуры страницы?
2
3
4
152
Тег для создания блока (контейнера)
span
h1
p
div
С помощью какого тега можно подключить внешний файл css
href
link
a
head
Название сайта для вкладки задается в теге:
link
title
head
body
К тегам, создающим структуру веб-страницы, не относится тег -
body
header
html
head
Как добавить картинку?
<image src="image.jpg" alt="MyImage">
<img src="image.jpg" alt="MyImage">
<img alt="MyImage">image.jpg</img>
<img href="image.jpg" alt="MyImage">
Выберите символ, которым заканчивается любое свойство CSS
Точка с запятой (;)
Двоеточие (:)
Точка (.)
Слеш (/)
Выберите атрибут, с помощью которого в теге <a> указывается ссылка
href
src
alt
width
Выберите способы подключения стилей
С помощью ссылки на внешнюю таблицу
Внутри контейнера <head>
Внутри любого тега
В начале тега <html>
За что отвечает псевдотег <!DOCTYPE HTML>
голова сайта
начало страницы
версия html
тип сайта
1. Какое значение прописать свойству flex-direction, чтобы элементы следовали в обратном порядке, снизу вверх?
column
column-reverse
wrap-reverse
column-wrap
Для чего служит модель CSS flexbox?
Способ компоновки элементов
Используется для кроссбраузерной верстки
Используется для добавления комментариев
Как сделать элемент flex-контейнером?
flex-direction: row
position: sticky
display: flex
flex-wrap: wrap
Какое из этих значений НЕ может быть значением для font-size?
50%
4
5mm
10rem
С помощью какого свойства можно изменить регистр букв в слове?
text-transform
text-decoration
text-overflow
text-bolshie-bukvi
Верстка - это...
Свободный набор инструментов для создания сайтов и веб-приложений. Включает в себя HTML- и CSS-шаблоны оформления для типографики, веб-форм, кнопок, меток, блоков навигации и прочих компонентов
Раздел программирования, ориентированный на разработку веб-приложений
монтаж полос оригинал-макета из составных элементов: набранного текста, заголовков, таблиц, иллюстраций, украшений и пр. Также результат этого процесса, то есть готовые полосы
основанная на использовании компьютерной техники дисциплина, изучающая структуру и общие свойства информации, а также закономерности и методы её создания, хранения, поиска, преобразования, передачи и применения в различных сферах человеческой деятельности.
Какую программу мы будем использовать для верстки?
Microsoft Visual Code
Только блокнот
Notepad++
IntelliJ
Vim
Что такое URL?
Информация которая находится на веб-страницах
Уникальный адрес страницы в сети Интернет
Название языка, на котором создаются Web-страницы
Прикладной протокол
Что такое DHTML?
Протокол прикладного уровня передачи данных
компьютерная распределённая система для получения информации о доменах
Способ создания интерактивного веб-сайта, использующий сочетание статичного языка разметки HTML, скриптового языка JavaScript, CSS и DOM
Глобальный стандарт цифровой мобильной сотовой связи с разделением каналов по времени и частоте
Для чего нужен DNS?
Контролирует датчики сигнализации и осуществляет передачу данных на смартфон
Для передачи информации о местоположении устройства
Позволяет браузеру найти запрошенный пользователем сайт по имени домена
Для структурирования дизайна веб - страницы и её контента
Первая глобальная компьютерная сеть носила имя
BITNet
ARPANet
NSFNet
Какая из программ относится к программе видеоконференц-связи
Windows
Anti-Virus
Zoom
Cover Con
Основное предназначение DNS-серверов
хранение информации о доменах и ее предоставление по запросу пользователей
хранение файлов и веб-сайтов пользователей Интернета
управление сетевыми ресурсами и файлами организации
работа с почтовыми приложениями, обработка информации
Надежный протокол для обеспечения защиты трафика от перехвата
FTP
HTTPS
DHCP
HTTP
Как расшифровывается DNS в сфере
Domain Name System
Direct Numerical Simulation
Дожимная насосная станция
Digital Network System
Методы, используемые для получения доступа к несанкционированной информации
Трояны, кейлоггеры, письма с вирусами, фальшивые сайты
Письма с вирусами, троян-логгеры, HTTPS, шифрование паролей, файл-бомба
Перехват трафика у прокси, письма с фишинглоггерами, фальшивые IP адреса
Социальные сети, ложные страницы в википедии, boot-логгеры, VNC
Выберите атрибут, с помощью которого в теге <img> указывается ссылка на изображение
src
alt
width
height
Предложенный CSS стиль соответствует:
<style type="text/css">
TABLE {
background: grey;
border: double blue;
color: green;
}
</style>
серый фон ячеек, пунктирная рамка синего цвета;
серый фон ячеек, двойная рамка синего цвета;
цвет текста – зеленый;
цвет текста – серый;
двойная рамка серого цвета.
Свойство position:fixed
делает элемент родителем
делает его самим по себе
фиксирует элемент в конкретном месте
ничего не происходит
Какая ошибка допущена в приведенном коде?
<img href="/img/test.png" alt="">
Нужен зарывающий тег img
Путь к изображению указан не полностью
Необходимо дописать атрибут title
Вместо href необходимо писать src
