</> Praktum

Главная / HTML / Карточка на HTML

Урок 18 · HTML

Одна карточка: заголовок, текст, список и ссылка

Карточка — маленький самостоятельный кусок. Позже CSS поставит несколько карточек в ряд, но смысл собирается сейчас.

Почему это следующий шаг

Шаблон страницы есть. Первая полезная деталь внутри main — карточка занятия или товара.

Как сделать

Оберни карточку в article. Внутри h2, короткий абзац, список фактов и ссылка «подробнее». Не делай заголовком всю карточку. Ссылка должна быть текстовой, а не пустой обёрткой без слов. Несколько карточек подряд — это несколько article, а не один абзац с переносами.

<article>
  <h2>Вечерний HTML</h2>
  <p>Собираем первую страницу за одно занятие.</p>
  <ul><li>90 минут</li><li>Без опыта</li></ul>
  <a href="/html/">Программа</a>
</article>

Что проверить

  • У карточки есть заголовок второго уровня.
  • Ссылку можно понять без окружающего текста.
  • Две карточки не слиплись в один список.

Попробуй

Сделай три карточки занятий с разным названием и одной ссылкой.