• Теория
  • Теория

Многоуровневый список покупок

Кекс на связи со срочным поручением! Ваша задача — сверстать список покупок для приближающейся вечеринки. Заодно и закрепите свои навыки вёрстки очень вложенных списков.

В разметке нужно использовать только неупорядоченные списки, вложенные друг в друга.

Решение

Решение испытания будет доступно через несколько минут. Используйте его, если возникнут сложности. А пока попытайтесь пройти испытание самостоятельно.

<!DOCTYPE html>
<html lang="ru">
  <head>
    <meta charset="utf-8">
    <title>Многоуровневый список покупок</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <h1>Список покупок</h1>
    <ul>
      <li>Еда
        <ul>
          <li>Рыба
            <ul>
              <li>Филе форели, 2 шт</li>
              <li>Карась, 5 шт</li>
              <li>Окунь, 10 шт</li>
            </ul>
          </li>
          <li>Молочные продукты
            <ul>
              <li>Сметана</li>
              <li>Йогурт
                <ul>
                  <li>Жирный</li>
                  <li>Обезжиренный</li>
                </ul>
              </li>
            </ul>
          </li>
        </ul>
      </li>
      <li>Вещи
        <ul>
          <li>Игрушки
            <ul>
              <li>Когтеточка</li>
              <li>Мячи, 2 шт</li>
            </ul>
          </li>
          <li>Уход
            <ul>
              <li>Расчёска для шерсти</li>
              <li>Мусс для усов
              </li>
            </ul>
          </li>
        </ul>
      </li>
    </ul>
  </body>
</html>
Минимальный вид табов
  • index.html
HTML
HTML

Вы перешли на другую страницу

Кликните внутри мини-браузера, чтобы поставить фокус в это окно.

100%
Бабушка Кекс

Притормози, дружище

Проходить вызовы части «Разметка текста» тренажёра «Знакомство с HTML и CSS» можно после регистрации и оформления подписки.