Финальный тест 23/23 96%

Курсы §5. Знакомство с таблицами
1

Привет всем!
Не “сели” 2 строчки в финальном тесте. Первая строчка - Москва, вторая - Посещений. Подскажите.

.a1 {text-align: left; color: white; background-color: darkcyan; border-bottom: 1px solid black; border-top: 1px solid black;}
.a2 {text-align: center; color: white; background-color: lightblue;border-bottom: 1px solid black; border-top: 1px solid black}
.a3 {text-align: right; color: white; background-color: darkcyan; border-bottom: 1px solid black; border-top: 1px solid black}
.a4 {text-align: center;}
.a5 {text-align: right;}
.a6 {text-align: left;}
body {
width: 350px;
margin: 0;
padding: 0 10px;
font-size: 14px;
font-family: Arial, sans-serif;
}

table {border-collapse: collapse;}

th {padding: 10px;}

td { padding: 10px;border-bottom: 1px solid lightgray }

2

HTML-код покажите тоже, пожалуйста.

3 
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Испытание: итоговая таблица</title>
    </head>
    <body>
        <h1>Итоговая таблица</h1>
<table>
    <tr>
        
        <th class="a1"; style="width: 33%;">Город</th>       <th class="a2"; style="width: 33%;">Посещений</th>       <th class="a3"; style="width: 33%;">%</th>
        </tr>
        <tr>
        <td class="a6">СПб</td>         <td class="a4">199</td>             <td class="a5">65.12</td>
        </tr>
        <tr>
        <td class="a6">Москва</td>      <td class="a4">69</td>              <td class="a5">21.3</td>
        </tr>
        <tr>
        <td class="a6">Киев</td>        <td class="a4">5</td>               <td class="a5">8</td>
        </tr>
        <tr>
        <td colspan="2"; class="a6">Посещений за весь период</td><td class="a5">273</td>
        
        </tr>
</table>
    </body>
</html>
4

Они “сели”, просто эти строчки не белые. И в различиях вам показывается, что цвет не сходится. В своей таблице вы не использовали светло-желтый цвет.
(Ширину у th уберите из HTML-кода и перенесите в CSS.)

5

Здравствуйте.

Может монитор так плохо стал показывать. Я не заметил что строчки имеют жёлтый цвет, пока носом не уткнулся в монитор. Предлагаю сменить их на классический ядовито-зелёный цвет. ) Спасибо за подсказку Инесса… Подсмотрел как у других, немного изменил код, слишком нагруженный был.

.a2 {text-align: center;background-color: lightblue;}
.a4 {text-align: center;}
.a5 {text-align: right;}
.a6 {text-align: left;}
.a7 {background-color: lightyellow}
body {
width: 350px;
margin: 0;
padding: 0 10px;
font-size: 14px;
font-family: Arial, sans-serif;
}

table {border-collapse: collapse;}

th {padding: 10px;width: 33%;border-bottom: 1px solid black; border-top: 1px solid black; background-color: darkcyan;color: white;}

td { padding: 10px;border-bottom: 1px solid lightgray }

P.S. Проверить не могу, закончились попытки. Думаю всё ок. Можно продемонстрировать работу профи по этому заданию. Вероятно там код вообще в пару строк. )

6

Для ячеек первого столбца не обязательно писать выравнивание по левому краю. Классы a1 и a3 у вас не используются. Между двумя атрибутами в такой записи
<td colspan="2" class="a6"> точка с запятой не ставится, просто пробел.

1 лайк