-
Notifications
You must be signed in to change notification settings - Fork 2
Expand file tree
/
Copy pathmyths.html
More file actions
255 lines (239 loc) · 12.4 KB
/
Copy pathmyths.html
File metadata and controls
255 lines (239 loc) · 12.4 KB
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" />
<title>Mars Odyssey — Myths</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Orbitron&family=Roboto&display=swap" rel="stylesheet">
<!-- Favicon -->
<link rel="icon" href="https://cdn-icons-png.flaticon.com/512/4287/4287555.png" />
<!-- Bootstrap CSS -->
<link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
crossorigin="anonymous"
/>
<link rel="stylesheet" href="./CSS/style2.css" />
<!-- Minimal custom styles to match Mars theme -->
<style>
:root{ --accent:#b22222; }
body{ font-family:'Roboto',sans-serif; background:#fefefe; color:#333; }
/* Header background like other pages */
/* Navbar look aligned with your Photos page */
.navbar-dark .navbar-nav .nav-link{
color:#fff;
border:1px solid rgba(255,255,255,.25);
border-radius:.5rem;
padding:.4rem .8rem;
background:rgba(255,255,255,.06);
margin:.25rem .35rem;
}
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus{
background:rgba(255,255,255,.18);
border-color:rgba(255,255,255,.4);
}
.navbar-dark .navbar-nav .nav-link.active{
background:rgba(255,255,255,.28);
border-color:rgba(255,255,255,.6);
}
/* Cards with a subtle Mars accent */
.myth-card.card{
border:3px solid var(--accent);
border-radius:12px;
background:#fff;
box-shadow:0 2px 10px rgba(0,0,0,.06);
}
.myth-card .card-header{
background:#ffe4e1;
border-bottom:1px solid rgba(0,0,0,.06);
font-family:'Orbitron',sans-serif;
color:var(--accent);
}
</style>
</head>
<body>
<!-- HEADER -->
<header>
<h1 class="brand">The Newest Martian Chronicles</h1>
<p class="tagline mb-0">Unraveling the legends of the Red Planet</p>
<!-- NAVBAR (burger at <768px, expanded from md) -->
<nav class="navbar navbar-dark navbar-expand-md">
<div class="container">
<a class="navbar-brand d-md-none" href="#">Menu</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#mainNav"
aria-controls="mainNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-center" id="mainNav">
<ul class="navbar-nav">
<li class="nav-item"><a class="nav-link" href="index.html">Home</a></li>
<li class="nav-item"><a class="nav-link" href="history.html">History</a></li>
<li class="nav-item"><a class="nav-link active" aria-current="page" href="myths.html">Myths</a></li>
<li class="nav-item"><a class="nav-link" href="photos.html">Photos</a></li>
<li class="nav-item"><a class="nav-link" href="about.html">About the Project</a></li>
</ul>
</div>
</div>
</nav>
</header>
<!-- MAIN -->
<main class="container my-4">
<h2 class="mb-4" style="font-family:'Orbitron',sans-serif; color:var(--accent);">Myths vs Facts</h2>
<!-- Intro -->
<div class="row g-3 mb-3">
<div class="col-12">
<div class="card myth-card">
<div class="card-body">
From ancient omens to 19th-century “canals” and modern viral hoaxes, Mars has been a mirror for human hopes and fears.
This page traces the big myths — and the science that reshaped them — from antiquity to the dawn of the Space Age.
</div>
</div>
</div>
</div>
<!-- Timeline-like grid -->
<div class="row g-3">
<!-- 1 -->
<div class="col-12 col-md-6">
<div class="card myth-card h-100">
<div class="card-header">Antiquity</div>
<div class="card-body">
<h5 class="card-title">“Mars is the god of war.”</h5>
<p class="card-text"><strong>Myth:</strong> The red planet foretells conflict and bloodshed.</p>
<p class="card-text"><strong>Fact:</strong> Many cultures tied Mars’ red hue to war — Ares/Mars (Greeks/Romans), Nergal (Babylonians), Mangala (India).
Changes in brightness and motion were read as omens; today we know they’re orbital mechanics and dust.</p>
<p class="card-text"><em>Evidence:</em> Historical records; naked-eye observations.</p>
</div>
</div>
</div>
<!-- 2 -->
<div class="col-12 col-md-6">
<div class="card myth-card h-100">
<div class="card-header">Middle Ages</div>
<div class="card-body">
<h5 class="card-title">“Mars governs human fate.”</h5>
<p class="card-text"><strong>Myth:</strong> Mars dictates temperament and misfortune in horoscopes.</p>
<p class="card-text"><strong>Fact:</strong> Astrology gave Mars symbolic power; astronomy separated from it, showing planetary motions are predictable natural phenomena, not causes of events on Earth.</p>
<p class="card-text"><em>Evidence:</em> From Ptolemy to Copernicus/Kepler/Galileo/Newton.</p>
</div>
</div>
</div>
<!-- 3 -->
<div class="col-12 col-md-6">
<div class="card myth-card h-100">
<div class="card-header">1600s</div>
<div class="card-body">
<h5 class="card-title">“Those patches are seas and continents.”</h5>
<p class="card-text"><strong>Myth:</strong> Dark/bright areas are oceans and lands, implying an Earth-like world.</p>
<p class="card-text"><strong>Fact:</strong> Early telescopes showed albedo features (e.g., Syrtis Major). They’re volcanic plains, dust, and rock — not oceans.</p>
<p class="card-text"><em>Evidence:</em> Telescopic drawings (Huygens), later spectroscopy & imaging.</p>
</div>
</div>
</div>
<!-- 4 -->
<div class="col-12 col-md-6">
<div class="card myth-card h-100">
<div class="card-header">Late 1800s</div>
<div class="card-body">
<h5 class="card-title">“Engineered canals crisscross Mars.”</h5>
<p class="card-text"><strong>Myth:</strong> A global network of canals, built by an advanced civilization to move water.</p>
<p class="card-text"><strong>Fact:</strong> Schiaparelli’s “canali” meant channels; mistranslation + human pattern-finding led to canal maps (Lowell). Modern imaging shows no artificial lines — illusions from optics and expectation.</p>
<p class="card-text"><em>Evidence:</em> Historical drawings vs modern HST/Mars orbiter images.</p>
</div>
</div>
</div>
<!-- 5 -->
<div class="col-12 col-md-6">
<div class="card myth-card h-100">
<div class="card-header">1898 & beyond</div>
<div class="card-body">
<h5 class="card-title">“Martians will invade Earth.”</h5>
<p class="card-text"><strong>Myth:</strong> Fiction popularized Mars as home of intelligent, even hostile beings.</p>
<p class="card-text"><strong>Fact:</strong> Stories like <em>The War of the Worlds</em> inspired curiosity but are not evidence. Science requires observations, repeatable data, and testable hypotheses.</p>
<p class="card-text"><em>Evidence:</em> Literature vs observations; no confirmed artificial structures.</p>
</div>
</div>
</div>
<!-- 6 -->
<div class="col-12 col-md-6">
<div class="card myth-card h-100">
<div class="card-header">Early 1900s</div>
<div class="card-body">
<h5 class="card-title">“Geometric shapes prove ruins.”</h5>
<p class="card-text"><strong>Myth:</strong> Letters, grids, and artificial forms are visible on Mars.</p>
<p class="card-text"><strong>Fact:</strong> Low resolution + human pareidolia = false patterns. Better optics erased the illusions.</p>
<p class="card-text"><em>Evidence:</em> Improved telescopes; later spacecraft imaging.</p>
</div>
</div>
</div>
<!-- 7 -->
<div class="col-12">
<div class="card myth-card">
<div class="card-header">1950s–1960s</div>
<div class="card-body">
<h5 class="card-title">“Mars may have vegetation and canals.”</h5>
<p class="card-text"><strong>Myth:</strong> Seasonal “greening,” canals, even civilizations were still discussed by some.</p>
<p class="card-text"><strong>Fact:</strong> First flyby (Mariner 4, 1965) revealed a cratered, cold world with a thin CO₂ atmosphere — more lunar than Earth-like. Later missions refined that picture.</p>
<p class="card-text"><em>Evidence:</em> Mariner 4 flyby images; later Mariner/Mars orbiter data.</p>
</div>
</div>
</div>
</div>
<!-- Modern myths preview -->
<h3 class="mt-4" style="font-family:'Orbitron',sans-serif; color:var(--accent);">Modern Viral Myths (Preview)</h3>
<div class="row g-3">
<div class="col-12 col-lg-6">
<div class="card myth-card h-100">
<div class="card-body">
<h5 class="card-title">“Mars will look as big as the Moon.”</h5>
<p class="card-text"><strong>Fact:</strong> Hoax. Even at closest approach, Mars is a bright star-like disk to the naked eye.</p>
</div>
</div>
</div>
<div class="col-12 col-lg-6">
<div class="card myth-card h-100">
<div class="card-body">
<h5 class="card-title">“Viking found life in 1976.”</h5>
<p class="card-text"><strong>Fact:</strong> Ambiguous signals likely chemical; the search continues with rovers and returned samples.</p>
</div>
</div>
</div>
</div>
<!-- Test Yourself (no JS) -->
<h3 class="mt-4" style="font-family:'Orbitron',sans-serif; color:var(--accent);">Test Yourself</h3>
<div class="row g-3">
<div class="col-12 col-lg-4">
<details class="card myth-card p-3">
<summary>Mars is named after the god of war because it causes wars.</summary>
<p class="mt-2 mb-0"><strong>Answer:</strong> False. The association is symbolic (color), not causal.</p>
</details>
</div>
<div class="col-12 col-lg-4">
<details class="card myth-card p-3">
<summary>“Canali” meant artificial canals built by Martians.</summary>
<p class="mt-2 mb-0"><strong>Answer:</strong> False. It meant natural channels; “canals” was a mistranslation + imagination.</p>
</details>
</div>
<div class="col-12 col-lg-4">
<details class="card myth-card p-3">
<summary>Mariner 4 ended the idea of oceans and vegetation on Mars.</summary>
<p class="mt-2 mb-0"><strong>Answer:</strong> Largely true — the images reset expectations.</p>
</details>
</div>
</div>
</main>
<!-- FOOTER -->
<footer >
<div>
<p >© 2025 The Newest Martian Chronicles — Sources: NASA/JPL, ESA, Wikimedia Commons</p>
</div>
</footer>
<!-- Bootstrap JS (navbar burger) -->
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
crossorigin="anonymous"></script>
</body>
</html>