Загрузка данных

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <title>Таблица животных</title>
    <style>
        table {
            border-collapse: collapse;
            font-family: Arial, sans-serif;
            text-align: center;
            width: 100%;
            max-width: 900px;
            background-color: white;
        }
        th, td {
            border: 1px solid #333;
            padding: 10px;
            width: 20%;
        }
        .header-domestic { background-color: #f2f2f2; font-weight: bold; }
        .header-wild { background-color: #e1f5fe; font-weight: bold; }
        
        /* Поворот текста для примечания */
        .vertical-text {
            writing-mode: vertical-rl;
            transform: rotate(180deg);
            background-color: #e1f5fe;
            font-size: 14px;
            white-space: nowrap;
        }
        
        img {
            display: block;
            margin: 0 auto 5px;
            width: 120px; /* Фиксированная ширина для аккуратности */
            height: 90px;
            object-fit: cover;
            border-radius: 5px;
        }
        .animal-name { font-weight: bold; display: block; }
    </style>
</head>
<body>

    <table>
        <tr>
            <th colspan="2" class="header-domestic">Домашние животные</th>
            <th colspan="3" class="header-wild">Дикие животные</th>
        </tr>
        <tr>
            <th class="header-domestic">Могут летать</th>
            <th class="header-domestic">Не могут летать</th>
            <th class="header-wild">Могут летать</th>
            <th class="header-wild">Не могут летать</th>
            <th rowspan="3" class="vertical-text">Встречаются на территории нашей страны.</th>
        </tr>
        
        <tr>
            <td>
                <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/5/5e/Chicken_July_2009.jpg/220px-Chicken_July_2009.jpg" alt="Курица">
                <span class="animal-name">Курица</span>
            </td>
            <td>
                <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/3/37/Oryctolagus_cuniculus_Tasmania_2.jpg/220px-Oryctolagus_cuniculus_Tasmania_2.jpg" alt="Кролик">
                <span class="animal-name">Кролик</span>
            </td>
            <td>
                <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/a/a9/Corvus_corone_-regents_park.jpg/220px-Corvus_corone_-regents_park.jpg" alt="Ворона">
                <span class="animal-name">Ворона</span>
            </td>
            <td>
                <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/5/5a/Canis_lupus_265b.jpg/220px-Canis_lupus_265b.jpg" alt="Волк">
                <span class="animal-name">Волк</span>
            </td>
        </tr>

        <tr>
            <td>
                <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/3/39/Domestic_Goose.jpg/220px-Domestic_Goose.jpg" alt="Гусь">
                <span class="animal-name">Гусь</span>
            </td>
            <td>
                <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/b2/Hausziege_04.jpg/220px-Hausziege_04.jpg" alt="Коза">
                <span class="animal-name">Коза</span>
            </td>
            <td>
                <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/b0/Eurasian_Eagle_Owl_11.jpg/220px-Eurasian_Eagle_Owl_11.jpg" alt="Сова">
                <span class="animal-name">Сова</span>
            </td>
            <td>
                <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/1/16/Fox_at_the_Island_of_Vlieland_-_2012.jpg/220px-Fox_at_the_Island_of_Vlieland_-_2012.jpg" alt="Лиса">
                <span class="animal-name">Лиса</span>
            </td>
        </tr>
    </table>

</body>
</html>