Файл: Основы программирования на языке HTML (Основы программирования на HTML).pdf
Добавлен: 18.05.2023
Просмотров: 117
Скачиваний: 3
Таким образом код должен выглядеть:
<a href="yandexmaps://maps.yandex.ru/maps/213/moscow/?from=api-maps&ll=37.706242%2C55.817571&mode=usermaps&origin=jsapi_2_1_74&um=constructor%3Aa1785aaa7f150f7f1b7962a1f6edf71a8687c693a0ade31fbc3c6e7029073021&z=18">город Москва, Погонный проезд, дом 10, строение 5. Заезд с улицы 1-я Мясниковская.</a>
Дополнительно, владелец шиномонтажа попросил добавить карту на саму веб-страницу. Для этого мы используем сервис от Яндекса, обрисовываем местоположение шиномонтажа и получаем код для вставки на страницу:
<script type="text/javascript" charset="utf-8" async src="https://api-maps.yandex.ru/services/constructor/1.0/js/?um=constructor%3Aa1785aaa7f150f7f1b7962a1f6edf71a8687c693a0ade31fbc3c6e7029073021&width=500&height=400&lang=ru_RU&scroll=true"></script>
Третий блок <div> должен выглядеть так:
Изображение 14. Третий блок <div>.
В четвертом блоке <div> нужно заполнить контактные данные шиномонтажа. Для этого создадим три абзаца со следующим текстом по порядку:
Телефон: +79204650088
E-mail: ourmail@mail.ru
Мы в социальных сетях:
Телефонный номер выделим ссылкой и пропишем в атрибутах: href="tel: +79204650088" для того, чтобы на мобильных устройствах по нажатию на ссылке веб-браузер произвел перевод пользователя в программу набора телефонного номера.
По аналогии с электронной почтой укажем ссылку с атрибутом: href="emailto: ourmail@mail.ru". Нажатие по ссылке позволит запустить почтовый клиент на настольных и мобильных устройствах.
Текст «Мы в социальных сетях» выделим подчеркнутой линией при помощи тега <u>.
Далее нужно создать неотсортированный список при помощи тега <ul> и задать четыре элемента списка <li>, в которых будут указаны адреса страниц шиномонтажа в социальных сетях.
Содержание списка должно быть таким:
ВК, Facebook,Instagram, Telegram
Для каждого прописываем элемента прописываем ссылку <a> на любую страницу из этих социальных сетей.
Конечный вид должен быть как в этом изображении:
Изображение 15. Вид блока контакты.
На этом наша веб-страница готова и конечный результат должен выглядеть таким образом:
<!DOCTYPE html>
<html>
<head>
<title>Шиномонтажный сервис - В добрый путь!</title>
</head>
<body>
<h1>Официальный сайт шиномонтажного сервиса - "В добрый путь"!</h1>
<hr>
<div>
<h2>О сервисе</h2>
<p>Наш сервис предлагает услуги снятия, установки, балансировки колес для легковых автомобилей. Мы также занимаемся сезонным хранением колес.</p>
<p>Мы молодой, развивающийся шиномонтажный сервис, основанный 2 года назад, за прошедшие сезоны мы успели пройти стадию от "шиномонтажки" в гаражно-строительном кооперативе до аренды отдельно стоящего нежилого здания, планируем развиваться и дальше!</p>
<p>Мы всегда уважаем и ценим всех наших клиентов в любое время, в наших планах расширить услуги для грузовых автомобилей, ремонтировать покрышки (резину), продажа и утилизация резины, дисков.</p>
</div>
<hr>
<div>
<h2>Прайс-лист</h2>
<table>
<thead>Прайс-лист на услуги шиномонтажа легкового автомобиля</thead>
<tr>
<td></td>
<td>R13</td>
<td>R14</td>
<td>R15</td>
<td>R16</td>
<td>R17</td>
<td>R18</td>
</tr>
<tr>
<td>Снятие и установка 1 колеса</td>
<td>50</td>
<td>60</td>
<td>70</td>
<td>80</td>
<td>90</td>
<td>100</td>
</tr>
<tr>
<td>Технологическая мойка 1 колеса</td>
<td>30</td>
<td>30</td>
<td>30</td>
<td>30</td>
<td>40</td>
<td>50</td>
</tr>
<tr>
<td>Балансировка 1 колеса</td>
<td>100</td>
<td>110</td>
<td>120</td>
<td>130</td>
<td>140</td>
<td>150</td>
</tr>
<tr>
<td>Полный комплекс <br>(снятие и установка, <br> технологическая мойка, <br> балансировка 4 колес)</td>
<td>750</td>
<td>800</td>
<td>850</td>
<td>900</td>
<td>1000</td>
<td>1100</td>
</tr>
</table>
<p>Хранение комплекта колес (4) для легковых автомобилей за 1 сезон - <b>1600</b> рублей.</p>
<p><b>ВНИМАНИЕ!</b> Теперь мы можем оказать выездные услуги замены и балансировки всех колес вашего легкового автомобиля в пределах ВАО и СВАО, возможно с доставкой Вашего комплекта колес, который есть у нас на хранении. Фиксированная стоимость - <b>5000</b> рублей.</p>
</div>
<hr>
<div>
<h2>График работы и место положение</h2>
<p>Работаем каждый день с 08:00 до 20:00 без выходных и обеда. Государственные праздники - выходной день, просим понять. Предварительная запись и запись на выезд по телефону.</p>
<p>Находимся по адресу: <a href="yandexmaps://maps.yandex.ru/maps/213/moscow/?from=api-maps&ll=37.706242%2C55.817571&mode=usermaps&origin=jsapi_2_1_74&um=constructor%3Aa1785aaa7f150f7f1b7962a1f6edf71a8687c693a0ade31fbc3c6e7029073021&z=18"><i>город Москва, Погонный проезд, дом 10, строение 5. Заезд с улицы 1-я Мясниковская.</i></a></p>
<script type="text/javascript" charset="utf-8" async src="https://api-maps.yandex.ru/services/constructor/1.0/js/?um=constructor%3Aa1785aaa7f150f7f1b7962a1f6edf71a8687c693a0ade31fbc3c6e7029073021&width=500&height=400&lang=ru_RU&scroll=true"></script>
</div>
<hr>
<div>
<h2>Контакты</h2>
<p>Телефон: <a href="tel: +79204650088">+79204650088</a></p>
<p>E-mail: <a href="emailto: ourmail@mail.ru">ourmail@mail.ru</a></p>