-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy patharquitectura.html
174 lines (149 loc) · 7.25 KB
/
arquitectura.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
<!-- https://getmdl.io/started/index.html
https://materializecss.com/getting-started.html
https://mdbootstrap.com/docs/standard/getting-started/installation/ -->
<!DOCTYPE html>
<html lang="en">
<head>
<title>España | Arquitectura </title>
<!-- Font Awesome -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet" />
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/mdb-ui-kit/7.0.0/mdb.min.css" rel="stylesheet" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.min.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<script src="https://code.jquery.com/jquery-3.7.1.js" integrity="sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4="
crossorigin="anonymous"></script>
<!--Main Navigation-->
<header>
<style>
/* Height for devices larger than 576px */
@media (min-width: 992px) {
#intro {
/* margin-top: -58.59px; */
height: 50vh !important;
}
}
</style>
<!-- Navbar -->
<nav class="navbar navbar-expand-lg navbar-dark d-none d-lg-block fixed-top" style="z-index: 2000;">
<div class="container-fluid">
<!-- Navbar brand -->
<a class="navbar-brand nav-link" href="./index.html">
<a class="navbar-brand nav-link" href="./index.html">
<strong>Información de España</strong>
</a>
<button class="navbar-toggler" type="button" data-mdb-collapse-init data-mdb-target="#navbarExample01"
aria-controls="navbarExample01" aria-expanded="false" aria-label="Toggle navigation">
<i class="fas fa-bars"></i>
</button>
<div class="collapse navbar-collapse" id="navbarExample01">
<ul class="navbar-nav me-auto mb-2 mb-lg-0 d-flex flex-row">
<li class="nav-item active">
<a class="nav-link" href="./index.html">Página Principal</a>
</li>
<li class="nav-item">
<a class="nav-link h-50-page" href='./las-artes-visuales.html'>Las Artes Visuales</a>
</li>
<li class="nav-item">
<a class="nav-link h-50-page" href='./arquitectura.html'>Arquitectura</a>
</li>
<li class="nav-item">
<a class="nav-link h-50-page" href='./literatura.html'>Literatura</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Navbar -->
<!-- Background image -->
<div id="intro" class="bg-image vh-100 shadow-1-strong">
<img style="min-width: 100%; min-height: 100%;"
src="https://artincontext.org/wp-content/uploads/2022/06/Types-of-Spanish-Architecture.jpg" alt="" srcset="">
<!-- <video style="min-width: 100%; min-height: 100%;" playsinline autoplay muted loop>
<source class="h-100" src="assets/title-vid.mp4" type="video/mp4" />
</video> -->
<div class="mask" style="
background-color: rgba(0, 0, 0, 0.558);
">
<div class="container d-flex align-items-center justify-content-center text-center h-100">
<div class="text-white" data-mdb-theme="dark">
<h1 class="mt-4">Arquitectura</h1>
</div>
</div>
</div>
</div>
<!-- Background image -->
</header>
<!--Main Navigation-->
<!--Main layout-->
<div class="divider"></div>
<main class="mt-5">
<div class="container">
<!--Section: Content-->
<section>
<div class="d-flex align-items-center justify-content-center" style="text-align: center; gap: 2em;">
<style>
.col.col-md-6.reveal img {
height: 300px;
width: auto;
}
</style>
<div class="col col-md-6 reveal reveal-left">
<div class="row" style="font-size: 2em; display: flex; flex-direction: column; align-items: center;">
<img src="https://images.squarespace-cdn.com/content/v1/5e2762e485bd7133ea716e01/8a57951d-35d4-4a2c-a3c4-827a852bb427/murcia-cathedral.jpg" alt="" srcset="">
</div>
<div class="row" style="font-size: 2em; display: flex; flex-direction: column; align-items: center;">
Arquitectura Antigua
</div>
<div class="row" style="text-align: justify; padding: 0.5em 2em;">
En España, había muchos tipos de arquitectura antigua, como la arquitectura romana y la arquitectura gótica. El gótica tiene muchos arcos, ventanas, vidrieras. La arquitectura refleja las religiones de España, como el catolicismo y el islam. El estilo más popular fue Mudéjar, un mezcla de la arquitectura cristiana y musulmana. [1]
</div>
</div>
<div class="col col-md-6 reveal reveal-right">
<div class="row" style="font-size: 2em; display: flex; flex-direction: column; align-items: center;">
<img src="https://prescottlivingmag.com/wp-content/uploads/2020/06/spains-architecture-culture.jpg" alt="" srcset="">
</div>
<div class="row" style="font-size: 2em; display: flex; flex-direction: column; align-items: center;">
Arquitectura Moderna</div>
<div class="row" style="text-align: justify; padding: 0.5em 2em;">
En el arquitectura moderna, hay un movimiento llamado "Eclecticism". Este movimiento es un mezcla muchos estilos de arquitectura. También, hay un estilo "Catalan Modernism", que es un estilo cón más elementos natural y organico. [2]
</div>
</div>
</div>
</section>
<hr class="my-5" />
<section class="reveal reveal-up mb-4">
<div class="row">
<h4><strong> Fuentes Académicas (MLA)</strong></h4>
</div>
<div class="row">
<p style="font-family: 'Times New Roman', Times, serif;">
Rodriguez, V., Ginés, J. V., Harrison, R. J., O’Callaghan, J. F., Shubert, A., Koenigsberger, H. G., Carr, R., Richardson, J. S., Viguera, M. J., & Smith, C. D. (2025, January 22). Spain | History, Map, flag, population, currency, climate, & Facts. Encyclopedia Britannica. https://www.britannica.com/place/Spain/Architecture
</p>
</div>
<div class="row">
<p style="font-family: 'Times New Roman', Times, serif;">
Godoy, S. (2021, July 12). Everything you need to know about Spanish architecture. Homeschool Spanish Academy. https://www.spanish.academy/blog/everything-you-need-to-know-about-spanish-architecture/ </p>
</div>
</section>
<hr class="my-5" />
</main>
<!--Main layout-->
<!--Footer-->
<footer class="bg-light text-lg-start">
<hr class="m-0" />
<!-- Copyright -->
<div class="text-center p-3" style="background-color: rgba(0, 0, 0, 0.2);">
Made by: Vatsal Sharda
</div>
<!-- Copyright -->
</footer>
<!--Footer-->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mdb-ui-kit/7.0.0/mdb.umd.min.js"></script>
<script src="script.js"></script>
</body>
</html>