My first time linking webpages

This was the initial development of the site in beta
DanDWB · Jul 4, 2022 · 47d9f29 · 47d9f29
1 parent 2a7a1c3
commit 47d9f29
Show file tree

Hide file tree

Showing 12 changed files with 580 additions and 0 deletions.
diff --git a/About.html b/About.html
@@ -0,0 +1,152 @@
+<!DOCTYPE html>
+<html>
+
+<body>
+
+
+    <!DOCTYPE html>
+    <html>
+
+    <body>
+
+
+        <div class="topnav">
+            <a href="./Home.html">Home</a>
+            <a href="./Climate.html">Climate</a>
+            <a href="./Contact.html">Contact</a>
+            <a class="active" href="./About.html">About</a>
+
+      <h1>The Climate of Mars</h1>
+
+
+      </body>
+
+      <style>
+
+        .Mars3 {
+          float: right;
+        }
+
+       .Mars2 {
+        float: left;
+       }
+
+    p{
+      text-align: center;
+      color: white;
+      position: inherit;
+      font-size:  200%;
+      text-shadow: 2px 2px red;
+    }  
+
+    body{
+        background-color: black;
+    }
+
+    h1 {
+        color: red;
+        text-align: center;
+      font-size: 500%;
+    }
+
+      /* Add a black background color to the top navigation */
+    .topnav {
+    background-color: rgb(100, 6, 6);
+    overflow: hidden;
+
+    }
+
+    /* Style the links inside the navigation bar */
+    .topnav a {
+    float: left;
+    color: #f2f2f2;
+    text-align: center;
+    padding: 14px 16px;
+    text-decoration: none;
+    font-size: 17px;
+    }
+
+    /* Change the color of links on hover */
+    .topnav a:hover {
+    background-color: red;
+    color: black;
+
+    }
+
+    /* Add a color to the active/current link */
+    .topnav a.active {
+    background-color: rgb(11, 0, 0);
+    color: rgb(170, 95, 95);
+    }
+    </style>
+
+    </html>
+
+
+
+  <h1>About us</h1>
+
+
+  </body>
+
+  <style>
+
+    .Mars3 {
+      float: right;
+    }
+
+   .Mars2 {
+    float: left;
+   }
+
+p{
+  text-align: center;
+  color: white;
+  position: inherit;
+  font-size:  200%;
+  text-shadow: 2px 2px red;
+}  
+
+body{
+    background-color: black;
+}
+
+h1 {
+    color: red;
+    text-align: center;
+  font-size: 500%;
+}
+
+  /* Add a black background color to the top navigation */
+.topnav {
+background-color: rgb(100, 6, 6);
+overflow: hidden;
+
+}
+
+/* Style the links inside the navigation bar */
+.topnav a {
+float: left;
+color: #f2f2f2;
+text-align: center;
+padding: 14px 16px;
+text-decoration: none;
+font-size: 17px;
+}
+
+/* Change the color of links on hover */
+.topnav a:hover {
+background-color: red;
+color: black;
+
+}
+
+/* Add a color to the active/current link */
+.topnav a.active {
+background-color: rgb(11, 0, 0);
+color: rgb(170, 95, 95);
+}
+</style>
+
+</html>
+
diff --git a/Climate.html b/Climate.html
@@ -0,0 +1,115 @@
+<!DOCTYPE html>
+<html>
+
+<body>
+
+
+<div class="topnav">
+    <a href="./Home.html">Home</a>
+    <a class="active" href="./Climate.html">Climate</a>
+    <a href="./Contact.html">Contact</a>
+    <a href="./About.html">About</a>
+  </div>
+
+  <h1>The Climate of Mars</h1>
+
+  <img class="Mars2" src="C:\Users\44776\Downloads\Mars m\mars.2.jpg" alt="Mars climate image"
+  width="750px"
+  height="400px"
+
+  />
+
+
+
+  <p>The red planet Mars, named for the Roman god of war, has long been an omen in the night sky. And in its own way, the planet’s rusty red surface tells a story of destruction. Billions of years ago, the fourth planet from the sun
+     could have been mistaken for Earth’s smaller twin, with liquid water on its surface—and maybe even life. <br>
+     Now, the world is a cold, barren desert with few signs of liquid water. But after decades of study using orbiters, landers, and rovers, scientists have revealed Mars as a dynamic, windblown
+      landscape that could—just maybe—harbor microbial life beneath its rusty surface even today.</p>
+
+      <img class="Mars3" src="C:\Users\44776\Downloads\Mars m\mars.3" alt="Mars View"
+  width="750px"
+  height="400px"
+  />
+
+  <p>You may be thinking... Why migrate to Mars, and how is this even possible. As let's face it, no human has ever set foot on this red planet.
+    <br>Well, our transportation technology alone works off of simple teleportation rather than the convential space shuttle. 
+    In terms of breathable air, we have thought long and hard about a simple solution to mitigate this issue. That being a kinetic dome
+    which covers the habitable area, within this air tight dome, we plant trees that can be artifically grown
+  </p>
+
+  </body>
+
+  <style>
+
+    .Mars3 {
+      float: right;
+    }
+
+   .Mars2 {
+    float: left;
+   }
+
+
+  </body>
+
+  <style>
+
+    .Mars3 {
+      float: right;
+    }
+
+   .Mars2 {
+    float: left;
+   }
+
+p{
+  text-align: center;
+  color: white;
+  position: inherit;
+  font-size:  200%;
+  text-shadow: 2px 2px red;
+}  
+
+body{
+    background-color: black;
+}
+
+h1 {
+    color: red;
+    text-align: center;
+  font-size: 500%;
+}
+
+  /* Add a black background color to the top navigation */
+.topnav {
+background-color: rgb(100, 6, 6);
+overflow: hidden;
+
+}
+
+/* Style the links inside the navigation bar */
+.topnav a {
+float: left;
+color: #f2f2f2;
+text-align: center;
+padding: 14px 16px;
+text-decoration: none;
+font-size: 17px;
+}
+
+/* Change the color of links on hover */
+.topnav a:hover {
+background-color: red;
+color: black;
+
+}
+
+/* Add a color to the active/current link */
+.topnav a.active {
+background-color: rgb(11, 0, 0);
+color: rgb(170, 95, 95);
+}
+</style>
+
+</html>
+
diff --git a/Contact.html b/Contact.html
@@ -0,0 +1,86 @@
+<!DOCTYPE html>
+<html>
+
+<body>
+
+
+    <!DOCTYPE html>
+    <html>
+
+    <body>
+
+
+        <div class="topnav">
+            <a href="./Home.html">Home</a>
+            <a href="./Climate.html">Climate</a>
+            <a class="active" href="./Contact.html">Contact</a>
+            <a href="./About.html">About</a>
+
+            </div>
+
+      <h1>Contact</h1>
+
+
+
+      </body>
+
+      <style>
+
+    *{
+        background-color: black;
+        margin: 0;
+        padding: 0;
+        font-family: 'poppins', sans-serif;
+        box-sizing: border-box;
+    }
+    .hero{
+      width: 100%;
+      height: 100%;
+      background-image: linear-gradient(rgba(0,0,0,0.7), #3551b5) url("C:\Users\44776\Downloads\Mars m\mars5.jpg");
+      background-position: center;
+      background-size: cover;
+    }
+
+    h1 {
+        color: red;
+        text-align: center;
+      font-size: 500%;
+    }
+
+      /* Add a black background color to the top navigation */
+    .topnav {
+    background-color: rgb(100, 6, 6);
+    overflow: hidden;
+    opacity: 0.3;
+
+    }
+
+    /* Style the links inside the navigation bar */
+    .topnav a {
+    float: left;
+    color: #f2f2f2;
+    text-align: center;
+    padding: 14px 16px;
+    text-decoration: none;
+    font-size: 17px;
+    }
+
+    /* Change the color of links on hover */
+    .topnav a:hover {
+    background-color: red;
+    color: black;
+
+    }
+
+    /* Add a color to the active/current link */
+    .topnav a.active {
+    background-color: rgb(11, 0, 0);
+    color: rgb(170, 95, 95);
+    }
+    </style>
+
+    </html>
+
+
+
+
diff --git a/Mars.4.jpg b/Mars.4.jpg
diff --git a/c205aed3-b2a4-4b19-a0fd-ac79e19741e3.webp b/c205aed3-b2a4-4b19-a0fd-ac79e19741e3.webp