Code to create a website about mars exploration

 


<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Mars Exploration 🔴</title>

<style>

body{margin:0;font-family:Poppins,Arial,sans-serif;background:linear-gradient(135deg,#ffebee,#ffcdd2);color:#b71c1c;line-height:1.6;}

header{background:#c62828;color:white;text-align:center;padding:70px 20px;}

header h1{font-size:3rem;}

header p{font-size:1.2rem;color:#ffcdd2;}

nav{text-align:center;background:#b71c1c;padding:15px;}

nav a{color:#ffcdd2;margin:0 20px;text-decoration:none;font-weight:600;}

nav a:hover{color:white;}

section{padding:60px 20px;text-align:center;}

section h2{color:#b71c1c;font-size:2.3rem;margin-bottom:15px;}

section p{max-width:900px;margin:0 auto 25px;font-size:1.1rem;}

.cards{display:flex;flex-wrap:wrap;justify-content:center;gap:25px;margin-top:40px;}

.card{background:#ffcdd2;padding:25px;width:280px;border-radius:12px;box-shadow:0 5px 20px rgba(0,0,0,.2);transition:transform 0.3s;}

.card:hover{transform:translateY(-8px);background:#ef9a9a;}

.card h3{color:#b71c1c;}

footer{background:#b71c1c;color:white;text-align:center;padding:30px;font-size:22px;}

footer a{color:#ffcdd2;text-decoration:none;font-weight:bold;}

footer a:hover{text-decoration:underline;}

</style>

</head>

<body>


<header>

<h1>🔴 Mars Exploration</h1>

<p>Red Planet Missions & Discoveries 🚀</p>

</header>


<nav>

<a href="#intro">🪐 Introduction</a>

<a href="#missions">🚀 Missions</a>

<a href="#discoveries">🔬 Discoveries</a>

<a href="#future">🌌 Future Plans</a>

</nav>


<section id="intro">

<h2>🪐 Introduction</h2>

<p>Mars, the fourth planet from the Sun, has fascinated humans for centuries. Exploration involves sending rovers, orbiters, and landers to study its surface, climate, and potential for life. 🔴</p>

</section>


<section id="missions">

<h2>🚀 Notable Missions</h2>

<div class="cards">

<div class="card"><h3>🤖 Curiosity Rover</h3><p>Exploring Martian surface geology and searching for signs of past life.</p></div>

<div class="card"><h3>🛰️ Mars Odyssey</h3><p>Orbiter mapping the planet and studying radiation and surface composition.</p></div>

<div class="card"><h3>🚀 Perseverance Rover</h3><p>Searching for microbial life and collecting samples for return to Earth.</p></div>

<div class="card"><h3>📡 Insight Lander</h3><p>Studying Mars’ interior structure and seismic activity.</p></div>

</div>

</section>


<section id="discoveries">

<h2>🔬 Discoveries</h2>

<ul style="text-align:left;display:inline-block;font-size:1.1rem;">

<li>💧 Evidence of ancient water and riverbeds.</li>

<li>🪨 Mineral compositions suggesting past habitability.</li>

<li>🌡️ Climate insights: dust storms, temperature variations.</li>

<li>⚡ Detection of methane spikes, potential signs of life.</li>

</ul>

</section>


<section id="future">

<h2>🌌 Future Plans</h2>

<p>Future Mars missions aim to bring samples to Earth, develop manned missions, and possibly colonize the Red Planet. International collaboration continues to advance our understanding. 🌠</p>

</section>


<footer>

© 2025 <a href="https://freecodesforwebsites.blogspot.com/" target="_blank">Free Codes for Websites</a> | All rights reserved.

</footer>


</body>

</html>


Comments