-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
101 lines (95 loc) · 6.15 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="./pages/index.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Куда я поеду">
<meta name="author" content="Максим Ситников, Вероника Малышкова">
<title>Куда я поеду</title>
</head>
<body>
<div class="page">
<header class="header">
<nav class="header__links">
<ul class="header__list">
<li class="header__list-item">
<a class="header__link" href="#" target="_blank">Мечты</a>
</li>
<li class="header__list-item">
<a class="header__link" href="#" target="_blank">Ожидания</a>
</li>
<li class="header__list-item">
<a class="header__link" href="#" target="_blank">Реальность</a>
</li>
</ul>
<a class="header__link" href="#" target="_blank">Пожаловаться</a>
</nav>
</header>
<main class="content">
<section class="intro">
<div class="intro__text">
<h1 class="intro__heading">Куда я поеду</h1>
<h2 class="intro__title">Куда я поеду сразу, как можно будет куда-то поехать</h2>
</div>
<img class="intro__image" src="./images/intro-image.jpeg" alt="вид из окна самолета">
</section>
<section class="places">
<div class="place">
<img class="place__image" src="./images/places-forest.jpeg" alt="человек смотрит на лесной водопад">
<div class="place__information">
<h2 class="place__title">Поеду в лес</h2>
<div class="place__paragraphs">
<p class="place__text">Лес — экологическая система, биоценоз, в которой главной жизненной формой являются деревья.</p>
<p class="place__text">Лес — составная часть природы, понятие «лес» можно рассматривать на разных уровнях. В глобальном масштабе — это часть биосферы, в локальном — это может быть насаждение. Леса занимают около трети площади суши.</p>
</div>
</div>
</div>
<div class="place">
<img class="place__image_reverse" alt="человек смотрит на гору" src="./images/places-mountains.jpeg">
<div class="place__information_reverse">
<h2 class="place__title">Поеду в горы</h2>
<p class="place__text">Горные системы занимают 64 % поверхности Азии, 36 % — Северной Америки, 25 % — Европы, 22 % — Южной Америки, 17 % — Австралии и 3 % — Африки. В целом 24 % земной поверхности приходится на горы. 10 % всех людей живёт на территории гор. В горах берёт своё начало большинство рек Земли.</p>
</div>
</div>
<div class="place">
<img class="place__image" alt="человек смотрит на море" src="./images/places-black-sea.jpeg">
<div class="place__information">
<h2 class="place__title">Поеду на Чёрное море</h2>
<div class="place__paragraphs">
<p class="place__text">Я уплыву туда, где ни разу я не был, туда, где никто раньше не был. Никто и никогда раньше не был, я уплыву. Я позову тебя смотреть на синее небо и пить по капле синее небо, и падать в это синее небо, я позову.</p>
<p class="place__text">Уеду я на Чёрное-Чёрное море, на Чёрное-Чёрное море, на Чёрное-Чёрное море уеду я. Уеду я на Чёрное-Чёрное море, на Чёрное-Чёрное море, на Чёрное-Чёрное море.</p>
<p class="place__text">Уеду я.</p>
</div>
</div>
</div>
</section>
<section class="quotes">
<h3 class="quotes__heading">Люди</h3>
<h2 class="quotes__title">Что говорят и говорили люди о путешествиях</h2>
<ul class="quotes__list">
<li class="quotes__list-item">
<p class="quotes__author">Иван Бунин</p>
<blockquote class="quotes__quote">Человека делают счастливым три вещи: любовь, интересная работа и возможность путешествовать.</blockquote>
</li>
<li class="quotes__list-item">
<p class="quotes__author">Альбер Камю</p>
<blockquote class="quotes__quote">Путешествие как самая великая и серьезная наука помогает нам вновь обрести себя.</blockquote>
</li>
<li class="quotes__list-item">
<p class="quotes__author">Норвежская пословица</p>
<blockquote class="quotes__quote">Лишь тот, кто странствует, открывает новые пути.</blockquote>
</li>
<li class="quotes__list-item">
<p class="quotes__author">Мария Захарова</p>
<blockquote class="quotes__quote">В принципе зарубежная поездка – это серьезнейшее, ответственнейшее и очень рискованное предприятие.</blockquote>
</li>
</ul>
</section>
</main>
<footer class="footer">
<p class="footer__copyright">© 2021</p>
</footer>
</div>
</body>
</html>