-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
255 lines (248 loc) · 9.05 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
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!--SEO-->
<meta
name="keywords"
content="80, mejor etapa, historia, retro, cassette, take on me"
/>
<meta
name="description"
content="Descubre cantidad de datos importantes de los 80"
/>
<!--fin de SEO-->
<!--icon-->
<link
rel="shortcut icon"
href="assets/imgs/rubik.png"
type="image/x-icon"
/>
<!--css-->
<link rel="stylesheet" href="css/main.css" />
<link rel="stylesheet" href="css/styles.css" />
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3"
crossorigin="anonymous"
/>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"
/>
<!--fin css-->
<title>80s</title>
</head>
<body>
<!--header-->
<header class="encabezado">
<div class="primLogo">
<a href="index.html"
><img src="assets/imgs/rubik.png" alt="rubik" width="80px" id="rk"
/></a>
</div>
<!--navbar-->
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container-fluid">
<button
class="navbar-toggler"
type="button"
data-bs-toggle="collapse"
data-bs-target="#navbarTogglerDemo01"
aria-controls="navbarTogglerDemo01"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarTogglerDemo01">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="index.html"
>Home</a
>
</li>
<li class="nav-item">
<a class="nav-link" href="pages/imagenes.html">Imagenes</a>
</li>
<li class="nav-item">
<a class="nav-link" href="pages/musica.html">Musica</a>
</li>
<li class="nav-item">
<a class="nav-link" href="pages/innovaciones.html"
>Innovaciones</a
>
</li>
<li class="nav-item">
<a class="nav-link" href="pages/figurasI.html">Contacto</a>
</li>
</ul>
</div>
</div>
</nav>
<!--fin de navbar-->
</header>
<!--fin de header-->
<h1 class="primTitulo">Los años 80's</h1>
<!--container-->
<div class="container">
<!--indexSect-->
<section class="indexSect">
<article>
<p>
Estuvo marcada por contrastes, entre tensiones, tragedias pero
también grandes avances. Una década de contrastes Las tensiones de
la Guerra Fría entre Estados Unidos y la Unión Soviética, el
terrorismo mundial, la existencia del sida y otras grandes tragedias
marcaron la década de los 80. Pero también fue una época de grandes
avances y descubrimientos como el primer PC o el internet. Además,
fue la década donde brillaron artistas como el rey del pop, Michael
Jackson, y a nivel regional se puso fin a las dictaduras en varios
países de Latinoamérica.
</p>
<!--carrusel-->
<div
id="carouselExampleCaptions"
class="carousel slide"
data-bs-ride="carousel"
>
<div class="carousel-indicators">
<button
type="button"
data-bs-target="#carouselExampleCaptions"
data-bs-slide-to="0"
class="active"
aria-current="true"
aria-label="Slide 1"
></button>
<button
type="button"
data-bs-target="#carouselExampleCaptions"
data-bs-slide-to="1"
aria-label="Slide 2"
></button>
</div>
<div class="carousel-inner">
<div class="carousel-item active">
<img
src="assets/imgs/wallpaperbetter.com_1360x768.jpg"
class="d-block w-100"
alt="Volver al futuro"
/>
<div class="carousel-caption d-none d-md-block"></div>
</div>
<div class="carousel-item">
<img
src="assets/imgs/wallpaperbetter.com_1360x768 (1).jpg"
class="d-block w-100"
alt="Cassetes"
/>
<div class="carousel-caption d-none d-md-block"></div>
</div>
</div>
<button
class="carousel-control-prev"
type="button"
data-bs-target="#carouselExampleCaptions"
data-bs-slide="prev"
>
<span
class="carousel-control-prev-icon"
aria-hidden="true"
></span>
<span class="visually-hidden">Previous</span>
</button>
<button
class="carousel-control-next"
type="button"
data-bs-target="#carouselExampleCaptions"
data-bs-slide="next"
>
<span
class="carousel-control-next-icon"
aria-hidden="true"
></span>
<span class="visually-hidden">Next</span>
</button>
</div>
<!--fin de carrusel-->
</article>
<!--preguntas-->
<article class="quest">
<div>
<h3>¿Qué había en los 80?</h3>
<p>
Las tensiones de la Guerra Fría entre Estados Unidos y la Unión
Soviética, el terrorismo mundial, la existencia del sida y otras
grandes tragedias marcaron la década de los 80. Pero también fue
una época de grandes avances y descubrimientos como el primer PC o
el internet.
</p>
</div>
<div>
<h3>¿Que usaba la gente en los 80s?</h3>
<p>
La moda de estos años era extrovertida, prácticamente todo lo que
se te podía venir a la mente, era usable, se impusieron los
colores fuertes, mucha bisutería de grandes tamaños, peinados con
en cabello rizado con un volumen alto, y zapatos de todos los
estilos.
</p>
</div>
<div>
<h3>¿Cómo era la cultura en los 80?</h3>
<p>
A principios de la década de los 80, nuestra urbe comenzaba a
experimentar algunos cambios significativos. La población crecía
cada día más y con ella aparecía un nuevo paisaje urbano. Los
edificios, las industrias y los negocios dejaron atrás las calles
melancólicas llenas de árboles de los años setenta.
</p>
</div>
<div>
<h3>Contexto histórico de la generación del 80</h3>
<p>
La generación del 80 se formó en un contexto en el que el sistema
político argentino estaba en proceso de restauración luego de
reiterados hechos de corrupción y de fraude electoral. El 12 de
octubre de 1880 Julio A. Roca resultó ganador de las elecciones.
Roca fue un militar que se destacó por dirigir y concluir un
extenso conjunto de sangrientas expediciones militares que
conformaron la llamada conquista del desierto, que se inició en
1833 con Juan Manuel de Rosas y terminó en 1885 con Roca. En esa
conquista militar fueron aniquilados todos los indígenas que se
cruzaron por su camino.
</p>
</div>
</article>
<!--fin de preguntas-->
</section>
<!--fin del indexSect-->
</div>
<!--fin del container-->
<hr class="divider" />
<!--footer-->
<footer class="footer">
<div>
<a href="index.html" class="logo--footer">
<img src="assets/imgs/rubik.png" alt="rubik" width="80px" id="rk" />
</a>
</div>
<div class="redes">
<button class="btn--twitch">Twitch</button>
<button class="btn--lemonCash">Lemon Cash</button>
</div>
</footer>
<!--fin del footer-->
<!--scripts-->
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
crossorigin="anonymous"
></script>
<!--fin scripts-->
</body>
</html>