Введение в современные веб-технологии

Упражнение 1:

Номер 1

                
1. <p style="color:red;background:yellow;">test</p>
2. <p style="color=red;background=yellow;">test</p>
3. <p style="color=red;" style="background=yellow;">test</p>
4. <p color="red" background="yellow;">test</p>
                
                Какие строки не содержат ошибок (отображают текст красным на желтом фоне)?

Ответ:

(1) только 1

(2) 1, 3 и 4

(3) 2 и 4

(4) 1 и 4

(5) только 4

Номер 2

                
<link href="styles1.css" media="screen" rel="Stylesheet" type="text/css" />
<link href="styles2.css" media="print" rel="Stylesheet" type="text/css" />
<link href="styles3.css" title="Main" media="screen" rel="Stylesheet" type="text/css" />
<link href="styles4.css" title="New Style" media="screen" rel="Alternate stylesheet" type="text/css" />
                
                Какие таблицы стилей будут использоваться при просмотре в браузере по умолчанию?

Ответ:

(1) только первый (styles1)

(2) styles1, styles2 и styles3

(3) styles1 и styles3

(4) все

(5) только последний (styles4)

Номер 3

                
<link href="styles1.css" media="screen" rel="Stylesheet" type="text/css" />
<link href="styles2.css" media="print" rel="Stylesheet" type="text/css" />
<link href="styles3.css" title="Main" media="screen" rel="Stylesheet" type="text/css" />
<link href="styles4.css" title="New Style" media="screen" rel="Alternate stylesheet" type="text/css" />
                
                Какие таблицы стилей будут использоваться при просмотре в браузере в любом случае?

Ответ:

(1) только первый (styles1)

(2) styles1, styles2 и styles3

(3) styles1 и styles3

(4) все

(5) только последний (styles4)

Упражнение 2:

Номер 1

                
<style type="text/css">
div  {color:red;}
.div {color:green;}
#div {color:blue;}
</style>
...
<div>
Test
</div>
                
                Каким цветом будет выведен текст Test?

Ответ:

(1) красным

(2) зеленым

(3) синим

(4) черным

(5) зависит от браузера

Номер 2

                
<style type="text/css">
div  {color:red;}
.div {color:green;}
#div {color:blue;}
</style>
...
<div class="div">
Test
</div>
                
                Каким цветом будет выведен текст Test?

Ответ:

(1) красным

(2) зеленым

(3) синим

(4) черным

(5) зависит от браузера

Номер 3

                
<style type="text/css">
div  {color:red;}
.div {color:green;}
#div {color:blue;}
</style>
...
<div id="div">
Test
</div>
                
                Каким цветом будет выведен текст Test?

Ответ:

(1) красным

(2) зеленым

(3) синим

(4) черным

(5) зависит от браузера

Упражнение 3:

Номер 1

                
<style type="text/css">
a:link   {color:red;}
a:visited {color:green;}
a:hover  {color:blue;}
a:active  {color:yellow;}
</style>
...
<a href="http://www.microsoft.com">Microsoft.com</a>
                
                Какого цвета будет гиперссылка при наведении на нее мыши?

Ответ:

(1) красного

(2) зеленого

(3) синего

(4) желтого

(5) черного

Номер 2

                
<style type="text/css">
a:visited {color:green;}
a:link   {color:red;}
a:active  {color:yellow;}
</style>
...
<a href="http://www.microsoft.com">Microsoft.com</a>
                
                Какого цвета будет гиперссылка при наведении на нее мыши?

Ответ:

(1) красного

(2) зеленого

(3) синего

(4) желтого

(5) черного

Номер 3

                
<style type="text/css">
a:link   {color:red;}
a:visited {color:green;}
a:active  {color:yellow;}
a:hover  {color:blue;}
</style>
...
<a href="http://www.microsoft.com">Microsoft.com</a>
                
                Какого цвета будет гиперссылка в момент щелчка мыши?

Ответ:

(1) красного

(2) зеленого

(3) синего

(4) желтого

(5) черного

Упражнение 4:

Номер 1

                
<style type="text/css">
div   {color:black;}
div.red {color:red;}
</style>
...
1. <p class="red">test 1</p>
2. <div class="red">test 2</div>
                
                Какая из строк будет выведена красным?

Ответ:

(1) только 1

(2) только 2

(3) обе

(4) ни одна

(5) зависит от браузера

Номер 2

                
<style type="text/css">
div   {color:black;}
div .red {color:red;}
</style>
...
<div class="red">
1. test 1
2. <div class="red">test 2</div>
</div>
                
                Какая из строк будет выведена красным?

Ответ:

(1) только 1

(2) только 2

(3) обе

(4) ни одна

(5) зависит от браузера

Номер 3

                
<style type="text/css">
div   {color:black;}
div.red {color:red;}
</style>
...
<div class="red">
1. test 1
2. <div>test 2</div>
</div>
                
                Какая из строк будет выведена красным?

Ответ:

(1) только 1

(2) только 2

(3) обе

(4) ни одна

(5) зависит от браузера

Упражнение 5:

Номер 2

                
1. <h1>Глава 1</h1>
2. <p>Абзац 1</p>
3. <p>Абзац 2</p>
                
                На какие строки действует селектор h1 + p?

Ответ:

(1) 1

(2) 2

(3) 2 и 3

(4) все

(5) ни на одну

Номер 3

                
<div>
1. test 1
2. <div>test 2</div>
3. <div>test 3</div>
</div>
                
                На какие строки действует селектор div > div?

Ответ:

(1) 1

(2) 2

(3) 2 и 3

(4) все

(5) ни на одну

Упражнение 6:

Номер 1

                
<style type="text/css">
.wide   {width:200px;}
div.wide {width:300px;}
</style>
...
<div class="wide"></div>
                
                Какова ширина раздела?

Ответ:

(1) 200px

(2) 300px

(3) 250px

(4) 500px

(5) полная ширина окна

Номер 2

                
...
<td style="width:300px" width="200px">test</td>
...
                
                Какова ширина ячейки?

Ответ:

(1) 200px

(2) 300px

(3) 250px

(4) 500px

(5) определяется содержимым

Номер 3

                
<style type="text/css">
.red   {color:#ff0000;}
p.red {color:#0000ff;}
#note {color:#00ff00;}
</style>
...
<p class="red" id="note">test</p>
                
                Каков цвет текста?

Ответ:

(1) #ff0000 (красный)

(2) #0000ff (синий)

(3) #00ff00 (зеленый)

(4) #000000 (черный)

(5) #ffffff (белый)

Упражнение 7:

Номер 1

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

Ответ:

(1) h1

(2) p

(3) span

(4) ul

(5) div

Номер 2

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

Ответ:

(1) h1

(2) p

(3) span

(4) em

(5) table

Номер 3

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

Ответ:

(1) b

(2) small

(3) span

(4) em

(5) strong

Упражнение 8:

Номер 1

                

<a href="#">
    <img src="pic.png" alt="go" />
</a>

                
                Что является атрибутом элемента-якоря?

Ответ:

(1) a

(2) href

(3) #

(4) img

Номер 2

                Выберите верные утверждения о тэгах HTML.

Ответ:

(1) тэги всегда заключаются в угловые скобки

(2) закрывающий тэг не может содержать атрибутов

(3) открывающий тэг может одновременно являться закрывающим

Номер 3

                Что из перечисленного является необходимыми HTML-элементами в стандартном документе HTML 4.01?

Ответ:

(1) encoding

(2) head

(3) meta

(4) body

(5) html

(6) authors

(7) title

Упражнение 9:

Номер 1

                Выберите верные утверждения о XML.

Ответ:

(1) этот язык в настоящее время практически не используется

(2) он определяет формальные правила разметки для любых целей

(3) всякий HTML-документ является XML-документом

(4) XHTML-документ является XML-документом

Номер 2

                Выберите верные утверждения о XHTML.

Ответ:

(1) XHTML требует, чтобы все значения атрибутов были заключены в кавычки

(2) в XHTML значение обязательно для каждого атрибута

(3) каждый тег, содержащий другой тег или другое содержимое, должен иметь закрывающий тег

(4) XHTML-документ является XML-документом

Номер 3

                Выберите верные утверждения о CSS.

Ответ:

(1) он призван отделить представление от содержания HTML-документа

(2) CSS-код может быть размещен в отдельном файле

(3) не все совеременные браузеры поддерживают CSS

Упражнение 10:

Номер 1

                Какой HTML-элемент подходит для выделения фрагмента текста полужирным начертанием (без дополнительных css-правил)?

Ответ:

(1) em

(2) b

(3) span

(4) strong

(5) q

Номер 2

                Какой HTML-элемент подходит для выделения фрагмента текста курсивом (без дополнительных css-правил)?

Ответ:

(1) em

(2) b

(3) span

(4) strong

(5) i

Номер 3

                Какой HTML-элемент подходит для выделения фрагмента текста моноширинным шрифтом (без дополнительных css-правил)?

Ответ:

(1) em

(2) b

(3) code

(4) tt

(5) kbd

Упражнение 11:

Номер 1

 Имеется следующий HTML-фрагмент:
 
HTML
CSS
Javascript

Будут ли слова расположены на разных строках при просмотре документа в браузере?

Ответ:

(1) да

(2) да, если вставить между ними <br />

(3) да, если заключить весь фрагмент в <pre> .../pre>>

(4) да, если заключить каждое слово в элемент span

(5) да, если заключить каждое слово в элемент p

Номер 2

                Выберите верные утверждения об элементах div и p.

Ответ:

(1) во многих случаях они взаимозаменимы

(2) абзац можно поместить в секцию

(3) секцию можно поместить в абзац

(4) секция не выполняет логического форматирования, в отличие от абзаца

Номер 3

                Выберите верные утверждения об элементах ol, ul и li.

Ответ:

(1) элемент списка может содержать только текст

(2) элемент li должен быть погружен в ul или ol

(3) элементы ol и ul могут быть вложены в li

Упражнение 12:

Номер 1

                Имеется следующий HTML-фрагмент:
                
<p align=right style="text-align:left;">Hello</p>
                
                Браузер выравнивает абзац по левому краю. Почему?

Ответ:

(1) значение атрибута align записано без кавычек, и браузер игнорирует его

(2) атрибут align имеет нулевую стилевую специфичность, а style - большую

(3) в случае конфликта стилевых правил браузер применяет настройки по умолчанию

Номер 2

                Имеется следующий HTML-фрагмент:
                
    <div style="color: Red; border:1px solid; padding:5px;">
        <p>Абзац</p>
        <a href="#">Гиперссылка</a>
        <h4>Заголовок</h4>
        <span style="color: Green;">текстовый фрагмент</span>
    </div>
                
                Какие элементы будут отображены красным цветом?

Ответ:

(1) рамка секции

(2) фон секции

(3) абзац

(4) гиперссылка

(5) заголовок

(6) текстовый фрагмент

Номер 3

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

Ответ:

(1) mm

(2) pt

(3) px

(4) em

Введение в современные веб-технологии - тест 5