-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
119 lines (119 loc) · 8.35 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
115
116
117
118
119
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Jazz Vibes</title>
<meta name="description" content="Descubre la esencia y las vibras del jazz a través de nuestra página dedicada a este apasionante género musical.">
<meta name="keywords" content="JAZZ, HISTORIA JAZZ, MUSICA JAZZ, BLUES, SWING, JAZZ CLASICO, JAZZ EN VIVO, BLOGSPOT">
<!--Boostrap-->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.min.css">
<!--CSS-->
<link rel="stylesheet" href="./css/main.css">
</head>
<body>
<header> <!--Encabezado-->
<nav class="navbar navbar-expand-lg navegation">
<div class="container-fluid">
<a class="navbar-brand" href="./index.html">
<img src="./assets/logo/saxofon.png" alt="logo" class="logo">
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-end botones" id="navbarNavDropdown">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="./index.html">Inicio</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./pages/biografias.html">Biografias</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./pages/albumes.html">Albumes</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./pages/contacto.html">Contacto</a>
</li>
</ul>
</div>
</div>
</nav>
</header> <!--Encabezado-->
<main> <!--Main-->
<div>
<h1 class="titulos">¡Bienvenidos a Jazz Vibes!</h1>
</div>
<div class="linea"></div>
<section class="contenedor-bienvenida">
<h3 class="titulos">Descubre la esencia y las vibras del jazz a través de nuestra página dedicada a este apasionante género musical.</h3>
<ul class="intro">
<li><p><span class="negrita">Biografías: </span>Conoce las historias inspiradoras de los grandes artistas del jazz, desde los pioneros hasta los innovadores contemporáneos.</p></li>
<li><p><span class="negrita">Álbumes: </span>Sumérgete en una hermosa colección de canciones y fotos que definen el sonido del jazz en todas sus formas</p></li>
<li><p><span class="negrita">Contacto: </span>Donde podras contactarnos mediante un formulario, ver nuestra informacion y ubucacion.</p></li>
</ul>
</section>
<div class="parrafo">
<h2 class="titulos">Cual es el origen del jazz?</h3>
<p>Si hablamos de un lugar donde que está fuertemente relacionado con el origen de esta música, los historiadores se ponen de acuerdo en nombrar al estado de Luisiana, en la ciudad de Nueva Orleans. Allí nació y creció la cultura del jazz, como raíz en los habitantes de raza africana, más tarde llamados afro-americanos.</p>
<p>Ya desde el siglo 19, existían bandas y músicos que tocaban una música que estaba compuesta por himnos, marchas o valses, que se tocaba de una forma “hot”, destinada a un público formado por afro americanos, en buena parte recién llegados del campo. Concretamente, los autores coinciden en mencionar que la aparición del jazz fue consecuencia directa de la conjunción de diversos elementos históricos, raciales, sociales, religiosos y musicales que se dieron en la Nueva Orleans de fines del siglo XIX.</p>
</div>
<div class="linea"></div>
<div>
<h2 class="titulos">Artistas Destacados</h2>
</div>
<div class="separador"></div>
<section class="contenedor-artistas-destacados">
<article class="card">
<h3 class="titulos">Miles Davis</h3>
<img src="./assets/miles-davis/miles-davis.jpg" alt="Miles Davis" class="img border border-dark">
<p>Fue uno de los más grandes innovadores y pioneros del jazz. El toque de su trompeta tenía una inconfundible calidad y característica gracias a la sordina de acero Harmon, que le proporcionaba un toque íntimo y suave.</p>
</article>
<article class="card">
<h3 class="titulos">Louis Armstrong</h3>
<img src="./assets/louis-armstrong/louis-armstrong.jpg" alt="Louis Armstrong" class="img border border-dark">
<p>Uno de los innovadores musicales más importantes del siglo XX, Louis Armstrong es el padre del jazz: apodado Satchmo y Pops, de niño y adolescente, Armstrong vivió mil dificultades y penurias, por ejemplo su madre fue obligada a prostituirse y él, como todos los negros de Estados Unidos, sufrió la discriminación racial.</p>
</article>
<article class="card">
<h3 class="titulos">Billie Holiday</h3>
<img src="./assets/billie-holiday/billie-holiday.jpg" alt="Billie Holiday" class="img border border-dark">
<p>Fue una cantante estadounidense de jazz, considerada una de las tres voces femeninas más importantes e influyentes de este género musical, junto con Sarah Vaughan y Ella Fitzgerald. El crítico Robert Christgau consideraba que era «inigualable y posiblemente la mejor cantante del siglo».</p>
</article>
</section>
</main> <!--Main-->
<footer><!--Pie de pagina-->
<section class="container">
<div class="row text-center ">
<div class="col-12 col-md-4 mb-4 mb-md-0">
<h4>Accesos Rapidos</h4>
<ul class="list-unstyled">
<li class="py-1"><a href="./index.html" class="text-decoration-none">Inicio</a></li>
<li class="py-1"><a href="./pages/biografias.html" class="text-decoration-none">Biografias</a></li>
<li class="py-1"><a href="./pages/albumes.html" class="text-decoration-none">Albumes</a></li>
<li class="py-1"><a href="./pages/contacto.html" class="text-decoration-none">Contacto</a></li>
</ul>
</div>
<div class="col-md-4 mb-4 mb-md-0 text-center">
<a class="logo mb-3" href="./index.html"><img src="./assets/logo/saxofon.png" alt="logo" class="logo"></a>
</div>
<div class="col-12 col-md-4 mb-4 mb-md-0 text-center ">
<h4>Redes Sociales</h4>
<div class="social-media botones">
<a href="https://www.facebook.com/" class="text-light fs-2 me-3" target="_blank"><i class="bi bi-facebook"></i></a>
<a href="https://www.instagram.com/" class="text-light fs-2 me-3" target="_blank"><i class="bi bi-instagram"></i></a>
<a href="https://x.com/home?lang=es" class="text-light fs-2 me-3" target="_blank"><i class="bi bi-twitter-x"></i></a>
<a href="https://www.youtube.com/" class="text-light fs-2" target="_blank"><i class="bi bi-youtube" ></i></a>
</div>
</div>
</div>
<div class="linea"></div>
<div class="d-flex justify-content-center py-1">
<p>© 2024 Jazz Vibes. Todos los derechos reservados.</p>
</div>
</section>
</footer><!--Pie de pagina-->
<!--Boostrap-->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
</body>
</html>