Спецификация CSS2

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

Номер 1

Какое правило CSS центрирует текст по горизонтали в заголовочных ячейках и выводит данные полужирным шрифтом:

Ответ:

(1) TH { text-align: center; font-weight: 700 }

(2) TH { text-align: center; font-weight: bold }

(3) TH { text-align: left; font-weight: bold }

Номер 2

Какое правило выравнивает текст заголовочных ячеек по их базовой линии и центрирует текст по вертикали в каждой ячейке данных:

Ответ:

(1) TH { vertical-align: baseline } TD { vertical-align: middle }

(2) TH { vertical-align: base } TD { vertical-align: center }

(3) TH { vertical-align: line } TD { vertical-align: middle }

Номер 3

В каком примере ряд будет окружен сплошной зеленой рамкой толщиной 5px:

Ответ:

(1) TR#row1 { border-top: 5px solid green }

(2) TR#row3 { border-top: 4px solid yellow }

(3) TR#row3 { border-top: 2px solid blue }

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

Номер 1

В каком примере ряд будет окружен сплошной желтой рамкой толщиной 15px:

Ответ:

(1) TR#row3 { border-top: 15px solid yellow }

(2) TR#row2 { border-top: 10px solid black }

(3) TR#row1 { border-top: 20px solid gray }

Номер 2

Какое правило помещает заголовок таблицы над таблицей:

Ответ:

(1) CAPTION { caption-side: bottom }

(2) CAPTION { caption-side: top }

(3) CAPTION { caption-side: left }

Номер 3

Какое правило специфицирует, что при звуковом выводе каждый ряд данных произносится как "Заголовок, Данные, Данные":

Ответ:

(1) TH { speak-header: once }

(2) TH { speak-header: always }

(3) TH { speak-header: only }

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

Номер 1

Какое правило специфицирует, что при звуковом выводе каждый ряд данных произносится как "Заголовок1 Ячейка1 Заголовок1 Ячейка2":

Ответ:

(1) TH { speak-header: once }

(2) TH { speak-header: never }

(3) TH { speak-header: always }

Номер 2

Какое правило заставляет элемент FOO работать как элемент TABLE в HTML, а элемент BAR - как элемент CAPTION:

Ответ:

(1) FOO { display : table } BAR { display : table-caption }

(2) FOO { display : table } BAR { display : table }

(3) FOO { display : table } BAR { display : caption }

Номер 3

Какое правило специфицирует, что элемент определяет таблицу уровня блока:

Ответ:

(1) TABLE { display: table }

(2) TD, TH { display: table-cell }

(3) TR { display: table-row }

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

Номер 1

Какое правило специфицирует, что элемент - это ряд ячеек:

Ответ:

(1) TD, TH { display: table-cell }

(2) COLGROUP { display: table-column-group }

(3) TR { display: table-row }

Номер 2

В каком примере три элемента 'table-cell' содержат текст в рядах:

Ответ:

(1) <STACK> <ROW>This is the <D>top</D> row.</ROW> <ROW>This is the <D>middle</D> row.</ROW> <ROW>This is the <D>bottom</D> row.</ROW> </STACK>

(2) <STACK> <BOX>This is the <D>top</D> row.</ROW> <BOX>This is the <D>middle</D> row.</ROW> <BOX>This is the <D>bottom</D> row.</ROW> </STACK>

(3) <STACK> <HROW>This is the <D>top</D> row.</ROW> <HROW>This is the <D>middle</D> row.</ROW> <HROW>This is the <D>bottom</D> row.</ROW> </STACK>

Номер 3

Выберите корректные примеры:

Ответ:

(1) STACK { display: inline-table }

(2) ROW { display: table-row }

(3) D { display: inline; font-weight: bolder }

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

Номер 1

Какие свойства применяются к элементам столбцов и групп столбцов:

Ответ:

(1) 'border'

(2) 'background'

(3) 'width'

Номер 2

Выберите корректные примеры:

Ответ:

(1) COL { border-style: none solid }

(2) TABLE { border-style: hidden }

(3) COL.totals { background: blue }

Номер 3

Позиция и выравнивание заголовка осуществляется с помощью следующего свойства:

Ответ:

(1) 'caption-side'

(2) 'caption'

(3) 'side'

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

Номер 1

Свойство 'caption-side' может принимать такие значения:

Ответ:

(1) { caption-side: top }

(2) { caption-side: bottom }

(3) { caption-side: left }

Номер 2

Какое правило позиционирует бокс заголовка над боксом таблицы:

Ответ:

(1) { caption-side: top }

(2) { caption-side: inherit }

(3) { caption-side: right }

Номер 3

Какое правило позиционирует бокс заголовка под боксом таблицы:

Ответ:

(1) { caption-side: right }

(2) { caption-side: inherit }

(3) { caption-side: bottom }

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

Номер 1

В каком примере свойство 'caption-side' размещает заголовок под таблицей. Заголовок будет той же ширины, что и родитель таблицы, и текст заголовка будет выровнен по левому краю:

Ответ:

(1) CAPTION { caption-side: bottom; width: auto; text-align: left }

(2)

CAPTION { caption-side: top; 
width: auto;
text-align: left }

(3) CAPTION { caption-side: bottom; width: auto; text-align: right }

Номер 2

В каком примере таблица центрирована установкой левого и правого полей в 'auto':

Ответ:

(1) TABLE { margin-left: auto; margin-right: none }

(2) TABLE { margin-left: auto; margin-right: auto }

(3) TABLE { margin-left: none; margin-right: auto }

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

Номер 1

Управлять алгоритмами ширины таблицы можно с помощью свойства:

Ответ:

(1) 'table-width'

(2) 'layout'

(3) 'table-layout'

Номер 2

Свойство 'table-layout' может иметь такие значения:

Ответ:

(1) { table-layout: auto }

(2) { table-layout: inherit }

(3) { table-layout: none }

Номер 3

В каком примере использован алгоритм фиксированного вывода таблицы:

Ответ:

(1) { table-layout: fixed }

(2) { table-layout: inherit }

(3) { table-layout: auto }

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

Номер 1

Высота таблицы задается с помощью следующих свойств:

Ответ:

(1) 'inline'

(2) 'table'

(3) 'inline-table'

Номер 2

В каком правиле верх бокса ячейки выровнен по первому ряду:

Ответ:

(1) { vertical-align: top }

(2) { vertical-align: baseline }

(3) { vertical-align: middle }

Номер 3

Горизонтальное выравнивание содержимого ячейки в боксе ячейки специфицируется свойством:

Ответ:

(1) 'text-align'

(2) 'text-shadow'

(3) 'text-indent'

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

Номер 1

Какое свойство выбирает модель рамки таблицы:

Ответ:

(1) 'border-collapse'

(2) 'border-spacing'

(3) 'empty-cells'

Номер 2

Управлять моделью раздельных рамок можно с помощью свойства:

Ответ:

(1) 'border-collapse'

(2) 'border-spacing'

(3) 'speak-header'

(4) 'empty-cells'

Номер 3

Управлять обрамлением пустых ячеек можно с помощью свойства:

Ответ:

(1) 'speak-header'

(2) 'empty-cells'

(3) 'border-collapse'

(4) 'border-spacing'

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

Номер 1

Какое правило вызывает прорисовку рамок вокруг всех ячеек:

Ответ:

(1) TABLE { empty-cells: hide }

(2) TABLE { empty-cells: inherit }

(3) TABLE { empty-cells: none }

(4) TABLE { empty-cells: show }

Номер 2

Таблица с двумя пропущенными внутренними рамками будет отображена в следующем примере:

Ответ:

(1) <TABLE style="border-collapse: collapse; border: solid;"> <TR><TD style="border-right: hidden; border-bottom: hidden">foo</TD> <TD style="border: solid">bar</TD></TR> </TABLE>

(2) <TABLE style="border-collapse: collapse; border: solid;"> <TR><TD style="border-right: hidden; border-bottom: hidden">foo</TD> <TD style="border: solid">bar</TD></TR> <TR><TD style="border: none">foo</TD> <TD style="border: solid">bar</TD></TR> </TABLE>

(3) <TABLE style="border-collapse: collapse; border: solid;"> <TR><TD style="border: none">foo</TD> <TD style="border: solid">bar</TD></TR> </TABLE>

Номер 3

В каком примере верх рамки таблицы установлен в 'hidden', чтобы подавить верхний край рамки первого ряда:

Ответ:

(1) TABLE[rules=rows] TR { border-top: solid }

(2)

TABLE[rules=rows] { border-collapse: collapse; 
  border-top: hidden }

(3) TABLE[rules=rows] TR { border-top: solid } TABLE[rules=rows] { border-collapse: collapse; border-top: hidden }

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

Номер 1

В каком примере рамка будет состоять из точек:

Ответ:

(1) { border-style: dotted }

(2) { border-style: double }

(3) { border-style: solid }

(4) { border-style: dashed }

Номер 2

Управлять говорящими заголовками можно с помощью свойства:

Ответ:

(1) 'border-collapse'

(2) 'speak-header'

(3) 'empty-cells'

Номер 3

В каком примере заголовок будет произносится однократно перед серией ячеек:

Ответ:

(1) { speak-header: once }

(2) { speak-header: always }

(3) { speak-header: inherit }

Спецификация CSS2 - тест 17