-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
197 lines (183 loc) · 7.92 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
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="estilos.css">
<link rel="icon" href="imagenes/favicon-nobg.png" type="image/x-icon">
<script src="https://kit.fontawesome.com/7f6b0c3d34.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="main.js"></script>
<title>The Police-Codo a codo por Francisco Paterson</title>
</head>
<body>
<header>
<div class="logo">
<a href="index.html"><img src="imagenes/logo.png" alt="logo"></a>
</div>
<div class="barra">
<ul>
<li><a href="#historia">HISTORIA E INTEGRANTES</a></li>
<li><a href="#discografia"> DISCOGRAFÍA</a></li>
<li><a href="#video">VIDEO</a></li>
<li><a href="#contacto">CONTACTO</a></li>
</ul>
</div>
</header>
<div class="hero">
<img class="kenburns-top" src="imagenes/banda_grande.jpg" alt="">
</div>
<section class="historia-e-integrantes">
<div id="historia">
<h2 class="titulo">Historia</h2>
<p>Este "power trío" británico de rock -bajo, guitarra y batería, estuvo activo desde
finales de la década de 1970 hasta mediados de la década de 1980 y tiene actualmente a sus tres integrantes
tocando
por separado pero aún interpretando música. Su estilo musical estuvo marcado por influencias del rock,
reggae y jazz. Aunque el origen de su nombre no es claro, la versión más difundida tiene que ver con que
el padre del baterista trabajaba para servicios de seguridad, lo que inspiró el bautismo policial. </p>
<p> La banda se formó en el
año 1977 en Londres y tocaron oficialmente hasta 1986,
con una pausa entre marzo de 1984 y julio de 1986. Nunca emitieron un comunicado
sobre su disolución. En la década del 2000 se reunieron e hicieron una gira mundial, que incluyó a Buenos
Aires. El trío ha vendido casi 70 millones de copias en todo el mundo.</p>
</div>
<div class="prendedor">
<span>
<img src="imagenes/prendedor.png" alt="">
</span>
</div>
<div class=biografias>
<h2 class="titulo">El Power Trío</h2>
<div class="bios">
<div class="bio">
<div class="imagen">
<img src="imagenes/sting.jpg" alt="Foto de Sting">
</div>
<h3 class="titulo">STING</h3>
<p>Gordon Matthew Thomas Sumner (Inglaterra, 2/10/51), es un músico y profesor de secundaria
que se desempeñó inicialmente como bajista, y más tarde también como cantante del grupo musical The
Police, formando luego su propia banda. También ha
dado su toque personal a algunas canciones renacentistas junto a laudistas
profesionales. Es practicante del sexo tántrico.</p>
</div>
<div class="bio">
<div class="imagen">
<img src="imagenes/asummers.jpg" alt="Foto de Andy Summers">
</div>
<h3 class="titulo">ANDY SUMMERS</h3>
<p>Andrew James Summers (Inglaterra, 31/12/42), es un músico, compositor y multiinstrumentista
reconocido internacionalmente
por ser el guitarrista de The Police. Actualmente toca covers de la banda en sus giras
internacionales y se dedica también a la fotografía.</p>
</div>
<div class="bio">
<div class="imagen">
<img src="imagenes/scopeland.jpg" alt="Foto de Stewart Copeland">
</div>
<h3 class="titulo">STEWART COPELAND</h3>
<p>Stewart Armstrong Copeland (EEUU, 16/07/52) es un músico, compositor y
multiinstrumentista, conocido por ser el baterista de The Police.
Es ampliamente considerado como uno de los mejores y más influyentes bateristas de rock
de todos los tiempos.</p>
</div> <!-- BIO-->
</div>
<!--BIOS-->
</div>
<!--BIOGRAFÍAS-->
</section>
<div class="prendedor">
<span>
<img src="imagenes/prendedor.png" alt="">
</span>
</div>
<section id="discografia">
<h2 class="titulo">Discografía de estudio</h2>
<div class="foto-grid-container">
<div class="foto-grid">
<div class='photo-grid-item'>
<a href="https://open.spotify.com/album/6EW7DSC8rjwBJIeAc1d7uQ" target="_blank">
<h3 class="titulo">Outlandos d'Amour (1978)</h3>
<img src='imagenes/outlandos.jpg' alt="Tapa disco Outlandos d'Amour">
</a>
</div>
<div class='photo-grid-item'>
<a href="https://open.spotify.com/album/5fMAuIxI96lqdSPqUGwlXd" target="_blank">
<h3 class="titulo">Reggatta De Blanc (1979)</h3>
<img src='imagenes/reggatta.jpg' alt="Tapa disco Reffatta de Blanc">
</a>
</div>
<div class='photo-grid-item'>
<a href="https://open.spotify.com/album/3eirZt4jPKEgO8puKpv4ZR" target="_blank">
<h3 class="titulo">Zenyatta Mondatta (1980)</h3>
<img src='imagenes/zenyatta.jpg' alt="Tapa disco Zenyatta Mondatta">
</a>
</div>
<div class="photo-grid-item">
<a href="https://open.spotify.com/album/2ccrabRMmY1gECUdyqblP2" target="_blank">
<h3 class="titulo">Ghost in the Machine (1981)</h3>
<img src="imagenes/ghost.jpg" alt="Tapa disco Ghost in the Machine">
</a>
</div>
<div class="photo-grid-item last-item">
<a href="https://open.spotify.com/album/7yDxJXFPl88Dt9kBo0dDD6" target="_blank">
<h3 class="titulo">Synchronicity (1983)</h3>
<img src="imagenes/synchronicity.jpg" alt="Tapa disco Synchronicity">
</a>
</div>
<!--Photo-grid-item last-item-->
</div>
<!--foto-grid-->
</div>
<!--foto-grid-container-->
</section>
<div class="prendedor">
<span>
<img src="imagenes/prendedor.png" alt="">
</span>
</div>
<section id="video">
<h2 class="titulo">Video más icónico del grupo</h2>
<div class="iframe-container">
<iframe width="560" height="315" src="https://www.youtube.com/embed/OMOGaugKpzs" title="YouTube video player" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
</section>
<div class="prendedor">
<span>
<img src="imagenes/prendedor.png" alt="">
</span>
</div>
<section id=contacto>
<h2 class="titulo">Contacto</h2>
<form id="form" class="form-contacto" method="POST" action="">
<input id="nombre" name="name" type="text" class="form-control" placeholder="Tu nombre"><br>
<input id="email" name="email" class="form-control" placeholder="Tu email"><br>
<textarea name="message" class="form-control" placeholder="Mensaje" rows="4"></textarea><br>
<div class="button-container">
<button type="submit" id="submitButton" class="myButton">ENVIAR</button>
<button type="reset" id="clearButton" class="myButton">BORRAR</button>
</div>
</form>
</section>
<div class="prendedor-final">
<span>
<img src="imagenes/prendedor.png" alt="">
</span>
</div>
<footer>
<div class="copyright">
<p>Copyright © 2023 Francisco Paterson and The Police</p>
</div>
<div class="social">
<div class="iconos">
<a target="_blank" rel="nofollow" href="https://www.facebook.com/thepolice" class="icono-redsocial lg"><i
class="fab fa-facebook-square"></i></a>
<a target="_blank" rel="nofollow" href="https://www.instagram.com/thepolicebandofficial/" class="icono-redsocial"><i
class="fab fa-instagram"></i></a>
</div>
</div>
</footer>
<script src="script.js"></script>
</body>