-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
114 lines (114 loc) · 9.76 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
102
103
104
105
106
107
108
109
110
111
112
113
114
<!DOCTYPE html> <!-- Определение версии HTML -->
<html lang="en"> <!-- Обозначение HTML-рзаметки -->
<head> <!-- Открытие головного раздела -->
<meta charset="UTF-8"> <!-- Установка кодировки символов -->
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- Призывает Internet Explorer работать в определённом режиме документа -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Мир музыки</title> <!-- Установка имени страницы -->
<link rel="icon" type="image/png" href="favi.png"> <!-- Установка Fav иконки -->
<link rel="stylesheet" href="style.css">
</head>
<body> <!-- Открытие основного сождержимого страницы -->
<header>
<h1><img id="favi" src="favi.png" height="100px" width="100px">World of Music</h1>
<nav>
<input id="menu-toggle" type="checkbox">
<label class='menu-button-container' for="menu-toggle">
<div class='menu-button'></div>
</label>
<ul class="hl">
<li><a href="#Instruments">Интсрументы</a></li>
<li><a href="#Geners">Жанры</a></li>
<li><a href="/artists">Испольнители</a></li>
<li><a href="/lyrics">Тексты песен</a></li>
</ul>
</nav>
<div>
<button aria-label = "Поиск"><img src="lupa.png" width="32px" height="32px"></button>
</div>
</header>
<div id="scroll">
<section class="list1">
<a class="content" href="/rap"><img class="img-scroll" src = "https://wallpaperaccess.com/full/240342.jpg" width="200px" height="200px">Hip-Hop</a>
<a class="content" href="/rap"><img class="img-scroll" src = "https://images.fineartamerica.com/images-medium-large/country-and-western-painting-peter-g-dobson.jpg" width="200px" height="200px">Country</a>
<a class="content" href="/rap"><img class="img-scroll" src = "https://i.pinimg.com/originals/0f/ef/4a/0fef4a739a1235ac3e8dcd39baad0e54.jpg" width="200px" height="200px">Metal</a>
<a class="content" href="/rap"><img class="img-scroll" src = "https://images.saatchiart.com/saatchi/1083954/art/4975745/4045567-HSC00001-7.jpg" width="200px" height="200px">Classic</a>
<a class="content" href="/rap"><img class="img-scroll" src = "https://i.pinimg.com/originals/97/81/87/978187408c09844294f380a696e684f5.jpg" width="200px" height="200px">Jazz</a>
<a class="content" href="/rap"><img class="img-scroll" src = "https://i.pinimg.com/originals/e9/8f/2e/e98f2e44a5f79157f646a8909020029b.jpg" width="200px" height="200px">Raggae</a>
<a class="content" href="/rap"><img class="img-scroll" src = "https://cdn.dribbble.com/userupload/3002948/file/original-bc8e627ae9d85300ed59a499d9bbd3e8.png?crop=0x470-2500x2345&resize=400x0" width="200px" height="200px">Indie</a>
<a class="content" href="/rap"><img class="img-scroll" src = "https://cdn.dribbble.com/users/116958/screenshots/14004393/media/dd7852201bf236726eb86f50881f8118.jpg?compress=1&resize=400x300" width="200px" height="200px">Punk</a>
<a class="content" href="/rap"><img class="img-scroll" src = "https://render.fineartamerica.com/images/rendered/search/print/8/8/break/images/artworkimages/medium/2/retro-futuristic-background-1980s-kelvin-degree.jpg" width="200px" height="200px">Electronic</a>
<a class="content" href="/rap"><img class="img-scroll" src = "https://thumbs.dreamstime.com/b/alternative-music-means-sound-track-alternates-indicating-other-way-harmonies-75796232.jpg" width="200px" height="200px">Alternative</a>
<a class="content" href="/rap"><img class="img-scroll" src = "https://www.googobits.com/wp-content/uploads/2018/06/blues-music.jpg" width="200px" height="200px">Blues</a>
</section>
</div>
<main>
<aside>
<h3>Подборки: </h3>
<ul>
<li>
<a href="/news">
Свежие новости
</a>
</li>
<li>
<a href="/charts">
Чарты
</a>
</li>
</ul>
</aside>
<article>
<h2 id="Instruments">Музыкальные инструменты</h2> <!-- Заголовок второго уровня с якорем -->
<section>
<h3>Струнные:</h3> <!-- Заголовок третьего уровня -->
<ul id="ill"> <!-- Неупорядоченный список -->
<li><b>Гитара</b></li> <!-- Ссылка на сторонний ресурс -->
<img id="Guitar" src=" https://upload.wikimedia.org/wikipedia/commons/thumb/e/e6/My_Mates_3_%282082240480%29.jpg/800px-My_Mates_3_%282082240480%29.jpg?20110827195734"> <!-- Изображение со стороннего ресурса -->
<p>Пожалуй, гитара является <em>самым популярным</em> струнным инструментом в мире, и на это есть несколько причин: <br></p>
<ol type="a" start="1"> <!-- Вложенный упорядоченный список -->
<li>Гитара является довольно простым инструментом для освоения, в том числе самостоятельного.</li>
<li>Гитара крайне мобильный инструмент.</li>
<li>Гитара - идеальный аккомпонемент.</li>
<li>Также на гитару можно "переложить" музыку практически любого жанра.</li>
</ol>
<a id="less" href="https://www.youtube.com/playlist?list=PLsr4InzR8HwVuo0bzVH1SiGBgHeC_PlGz">Бесплатные уроки гитары на youtube</a> <!-- Ссылка на сторонний ресурс -->
<li><b>Скрипка</b></li>
<img id="scrip" src=" https://www.classic-music.ru/media/images/term/thumbnail400_14092012.jpg">
<li><b>Виолончель</b></li>
<li><b>Контрабас</b></li>
</ul>
</section>
<section>
<h3>Духовые</h3>
</section>
<h2 id="Geners">Жанры музыки</h2> <!-- Заголовок второго уровня с якорем -->
<section>
<dl> <!-- Список терминов -->
<dt><i>Джаз</i><dt>
<dd>— это направление в музыке, которое возникло в США в самом начале XX века. В нем тесно переплетаются ритмы, обрядовые песнопения и рабочие песни афроамериканцев, а также гармоническая составляющая, присущая музыке белых переселенцев.</dd>
<dd>-др.: это импровизационный жанр, появившийся в результате смешивания западноевропейской и западноафриканской музыки.</dd>
<dt><i>Блюз</i></dt>
<dd>— это своеобразная форма афроамериканских песен, исполненная глубоко горестного состояния духа, одиночества, тоски по утраченному счастью с широким использованием импровизаций при исполнении.</dd>
<dt><i>Классическая музыка</i></dt>
<dd>— это образцовые музыкальные произведения, золотой фонд мировой музыкальной культуры</dd>
<dt><i>Кантри</i></dt>
<dd>— это обобщённое название формы музицирования, возникшей среди белого населения сельских районов юга и запада США, и основанной на песенных и танцевальных мелодиях, завезённых в Северную Америку ранними переселенцами из Европы.</dd>
<dt><i>Рок</i></dt>
<dd>— это обобщающее название ряда направлений популярной музыки</dd>
<dd>-др.: слово rock возникло как сокращение от названия рок-н-ролла, хронологически первого жанра рок-музыки, и обозначает характерные для рок-н-ролла ритмические ощущения, связанные с определённой формой движения, по аналогии с roll, twist, swing, shake.</dd>
<p>Одним из поджанров рока является метал-рок. Яркими представителями можно смело назвать следующие коллективы: <abbr>SOAD</abbr>(System of a down), Powerwolf, <abbr>AC/DC</abbr>, Rammstein, Scorpions </p>
<dt><i>Хип-хоп</i>
</dl>
</section>
</article>
</main>
<footer>
<p>Свяжитесь с автором данной страницы:</p>
<address>
<a href="maito:[email protected]">[email protected]</a><br>
<a href="tel:89217875996">+7 (921) 787-59-96</a>
</address>
</footer>
</body>
</html>