From 77d6dda3c523ca5ef740eb3310c23502e70cf892 Mon Sep 17 00:00:00 2001
From: Adepeju4 <adepeju.kayode@gmail.com>
Date: Thu, 4 Mar 2021 08:59:41 +0100
Subject: [PATCH] html tasks 1, 2, 3

---
 Html task one/index.html   |  60 ++++++++++++++
 Html task three/index.html |  44 ++++++++++
 Html task two/index.html   | 159 +++++++++++++++++++++++++++++++++++++
 3 files changed, 263 insertions(+)
 create mode 100644 Html task one/index.html
 create mode 100644 Html task three/index.html
 create mode 100644 Html task two/index.html
diff --git a/Html task one/index.html b/Html task one/index.html
new file mode 100644
index 0000000..991f2e5
--- /dev/null
+++ b/Html task one/index.html	
@@ -0,0 +1,60 @@
+<!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">
+    <title>Document</title>
+</head>
+
+<body>
+    <h3>
+        This is my webpage.
+    </h3>
+
+    <p>
+        Lorem ipsum, dolor sit amet consectetur adipisicing elit. Ipsam, deserunt nesciunt asperiores dolorem animi voluptatum in dignissimos quis recusandae blanditiis ipsum a soluta. Tempora porro sunt architecto vel, consequatur ab?
+    </p>
+
+    <p>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt laboriosam, quam accusantium perferendis eum quibusdam fugiat nam! Eveniet, explicabo id! Quidem explicabo quae, perferendis quam hic eius error quibusdam ex!
+    </p>
+
+    <hr>
+
+    <div class="cats">
+        <h3>
+            A cat!
+        </h3>
+        <img src="https://images.unsplash.com/photo-1561948955-570b270e7c36?ixid=MXwxMjA3fDB8MHxzZWFyY2h8Mnx8Y2F0fGVufDB8fDB8&ixlib=rb-1.2.1&auto=format&fit=crop&w=700&q=60" alt="cat picture">
+
+        <h3>
+            Cat Breeds.
+        </h3>
+        <ul>
+            <li>Persian Cat</li>
+            <li>Maine Coon</li>
+            <li>Bengal Cat</li>
+            <li>British Shorthair</li>
+            <li>Siamese Cat</li>
+        </ul>
+
+        <h3>
+            Cat Food
+        </h3>
+        <ol>
+            <li>Meat</li>
+            <li>Whole Grains</li>
+            <li>Fish</li>
+            <li>Eggs</li>
+            <li>Veggies</li>
+        </ol>
+
+
+
+
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Html task three/index.html b/Html task three/index.html
new file mode 100644
index 0000000..640d66c
--- /dev/null
+++ b/Html task three/index.html	
@@ -0,0 +1,44 @@
+<!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">
+    <title>Document</title>
+</head>
+
+<body>
+    <hr>
+    <h2>
+        Welcome!!!!!!!!!!!
+    </h2>
+    <div class="catFight">
+        <h3>Watch cats play around!</h3>
+
+        <iframe width="400" height="245" src="https://www.youtube.com/embed/-N8KbQ8IM4g" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+    </div>
+
+
+    <div class="catMusic">
+        <h3>
+            Cats love Carly Rae Jepsen.
+        </h3>
+        <iframe src="https://open.spotify.com/embed/album/1DFixLWuPkv3KT3TnV35m3" width="300" height="380" frameborder="0" allowtransparency="true" allow="encrypted-media"></iframe>
+    </div>
+
+
+    <div class="subscribe">
+        <p>
+            Subscribe to our mailing list here
+        </p>
+        <form action="">
+            <label for="email">Email</label>
+            <input type="email" name="email" id="email">
+
+            <button type="submit">Join Our Mailing List!</button>
+        </form>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Html task two/index.html b/Html task two/index.html
new file mode 100644
index 0000000..b1ec6e8
--- /dev/null
+++ b/Html task two/index.html	
@@ -0,0 +1,159 @@
+<!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">
+    <title>Document</title>
+</head>
+
+<body>
+    <header>
+        <ul>
+            <li style="display: inline;"><a href="">Home</a> </li>
+            <li style="display: inline;"><a href="">Contact Us</a> </li>
+            <li style="display: inline;"><a href="">About Us</a> </li>
+        </ul>
+    </header>
+    <hr>
+
+    <h3>
+        Articles
+    </h3>
+
+    <div class="article">
+        <h3>
+            Article 1 -The new vaccine volunteers.
+        </h3>
+        <p>
+            These people have volunteered to curb the spread of the virus!
+
+            <table border="1px">
+                <tr>
+                    <th>Name</th>
+                    <th>age</th>
+                    <th>sex</th>
+                </tr>
+
+                <tr>
+                    <td>Gojou Satoru</td>
+                    <td>24</td>
+                    <td rowspan="2">m</td>
+                </tr>
+                <tr>
+                    <td>Itadori Yuuji</td>
+                    <td>22</td>
+                </tr>
+                <tr>
+                    <td>Eren Yeager</td>
+                    <td>21</td>
+                    <td>m</td>
+                </tr>
+                <tr>
+                    <td>Levi Ackerman</td>
+                    <td rowspan="2">35</td>
+                    <td>m</td>
+                </tr>
+                <tr>
+                    <td>Alice Wonderland</td>
+                    <td>f</td>
+                </tr>
+
+            </table>
+        </p>
+    </div>
+
+    <div class="article">
+        <h3>Article 2 - Coming Soon!</h3>
+    </div>
+
+    <h3>
+        Contact Us!
+    </h3>
+
+
+    <div class="User-ID">
+        <div class="General-Information">
+            <h3>
+                General Information
+            </h3>
+            <form action="">
+                <p>
+                    <label for="firstName">First Name</label>
+                    <input type="text" id="firstName">
+
+                </p>
+                <p>
+
+                    <label for="lastName">Last Name</label>
+                    <input type="text" id="lastName">
+                </p>
+                <p>
+
+                    <label for="emailAddress">Email</label>
+                    <input type="email" id="emailAddress">
+                </p>
+
+                <p>
+                    <label for="dateOfBirth">Date of Birth</label>
+                    <input type="date" id="dateOfBirth">
+
+                </p>
+            </form>
+        </div>
+
+        <div class="job-choice">
+            <p>
+                What kimnd of work do you need?
+            </p>
+            <p>
+                <label for="programming"> Programming:</label>
+                <input type="radio" id="programming ">
+            </p>
+            <p>
+                <label for="design ">Design:</label>
+                <input type="radio" id="design ">
+            </p>
+            <p>
+                <label for="singing ">Singing:</label>
+                <input type="radio" id="singing ">
+            </p>
+            <p>
+                <label for="comedy ">Comedy:</label>
+                <input type="radio" id="comedy ">
+            </p>
+        </div>
+
+        <div class="design-skills">
+            <p>
+                How interested are you in design skills?
+            </p>
+            <p>
+                <label for="very_low">Very Low</label>
+                <input type="radio" id="very_low">
+            </p>
+            <p>
+                <label for="low">Low</label>
+                <input type="radio" id="low">
+            </p>
+            <p>
+                <label for="medium">Medium</label>
+                <input type="radio" id="medium">
+            </p>
+            <p>
+                <label for="high">High</label>
+                <input type="radio" id="high">
+            </p>
+            <p>
+                <label for="very_high">Very High</label>
+                <input type="radio" id="very_high">
+            </p>
+        </div>
+
+        <button type="submit">Submit</button>
+
+    </div>
+</body>
+
+</html>
\ No newline at end of file

Name	age	sex
Gojou Satoru	24	m
Itadori Yuuji	22	m
Eren Yeager	21	m
Levi Ackerman	35	m
Alice Wonderland	35	f