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

Раздел «О пилатесе»: решение

Вспомните вид блока:

В нашем варианте для разметки двух текстовых параграфов использованы теги p.

Если бы при щелчке на "подробнее" появлялся скрытый текст, то это была бы кнопка. Но по макету такое поведение не увидеть. Поэтому предполагаем самое простое поведение — "подробнее" просто ведёт на отдельную страницу. И размечаем этот элемент ссылкой.

Картинка. Всё-таки это изображение больше похоже на содержательное. На нём показывается и процесс занятий, и интерьер студии. Поэтому нужно использовать тег img.

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

А где в коде должен располагаться тег img? Есть два рабочих варианта: либо сразу после заголовка, до текста абзацев, либо в самом конце блока. Мы выбрали первый.

index.html

HTML

<!DOCTYPE html> <html lang="ru"> <head> <meta charset="utf-8"> <title>Студия пилатеса</title> </head> <body> <header class="main-header"> <nav class="main-nav"> <a class="logo" href="#"> <img src="img/empty.svg" width="70" height="30" alt="Логотип студии пилатеса"> </a> <ul class="site-navigation"> <li class="site-navigation-item"> <a href="#">О нас</a> </li> <li class="site-navigation-item"> <a href="#">Расписание</a> </li> <li class="site-navigation-item"> <a href="#">Стоимость</a> </li> <li class="site-navigation-item"> <a href="#">Отзывы</a> </li> </ul> </nav> <a class="phone" href="tel:+79183650707">+7 918 365 07 07</a> </header> <main> <h1>Студия пилатеса</h1> <p>Твоё здоровое тело через 10 занятий</p> <a href="#">Смотреть расписание</a> <section class="about"> <h2>О пилатесе</h2> <img src="img/empty.svg" width="800" height="500" alt="Как проходят занятия в нашей студии"> <p>Пилатес соединяет элементы растяжки с элементами силовой тренировки</p> <p>Комплекс упражнений укрепляет мышцы пресса и спины, улучшает гибкость мышц и связок, подвижность суставов и избавляет от дискомфорта в позвоночнике</p> <a href="#">Подробнее</a> </section> <section class="tariff"> <h2>Тарифы</h2> Уровень Новичок 150 руб. / занятие Записаться Уровень Профи 200 руб. / занятие Записаться Уровень Мастер 350 руб. / занятие Записаться </section> <section class="comments"> <h2>Отзывы</h2> Вероника Кулешова 25 лет Хожу на пилатес уже пять месяцев. После десяти занятий уже увидела результат: тело подтянулось, улучшилась осанка, появился пресс. И самое главное, пропал сильный изгиб поясничного отдела, который меня очень беспокоил. Надежда Петрова 23 года Начала заниматься пилатесом по достаточно банальной причине – хотелось поддерживать хорошую форму, и не ездить на занятия далеко от дома. занятие пилатесом с инвентарем Зал пилатеса был буквально через дорогу, поэтому и записалась туда. Оксана Тодоренко 19 лет У меня был печальный опыт занятий пилатесом, связанный с некомпетентностью инструктора, который проводил тренировки. Я занималась пилатесом 2 месяца, а потом забросила. </section> </main> <footer class="main-footer"> Pilates Plus, 2017 © ВКонтакте Facebook Instagram </footer> </body> </html>

ЗадачиВыполнено

Сравните код авторского решения с вашим и после этого переходите к следующему заданию.

Раздел «О пилатесе»: решение

Вход

Регистрация

Восстановление доступа