Add files via upload

GDG-GTBIT · Oct 17, 2021 · 10534ab · 10534ab
1 parent c1bc3f1
commit 10534ab
Show file tree

Hide file tree

Showing 4 changed files with 112 additions and 0 deletions.
diff --git a/Projects/Registration Form/README.md b/Projects/Registration Form/README.md
@@ -0,0 +1,15 @@
+<h1>Registration Form</h1>
+
+<h2>Tech Stacks:</h2>
+<ul>
+  <li>Html</li>
+  <li>CSS</li>
+</ul>
+
+<h2>How to execute:</h2>
+<h3>Run the index.html file</h3>
+
+<h2>Explanation:</h2>
+<p>This is a very simple registration form. I made this project for beginners to understanding the fundamentals of html,css. User can put the data.</p>
+
+<h2>Screenshot:</h2>
diff --git a/Projects/Registration Form/background.png b/Projects/Registration Form/background.png
diff --git a/Projects/Registration Form/index.html b/Projects/Registration Form/index.html
@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8">
+        <meta charset ="viewport" content="width-device=width,initial-scale=1">
+        <title>Registration Form Page HTML</title>
+        <link rel="stylesheet" href="style.css">
+    </head>
+<body>
+    <form>
+        <h1> Registration Form </h1>
+        <p>Fill the form carefully*</p>
+        <div class="container">
+           <label>Firstname</label>
+           <input type="text" id="fname" placeholder="" required>
+           <label>Lastname</label>
+           <input type="text" id="lname" placeholder="" required>
+            <br/><br/>
+           <label>Serial No</label>
+           <input type="text" id="lname" placeholder="" required>
+           <label>Date</label>
+           <input type="date" id="lname" placeholder="">
+           <!---------------------------------------------------->
+            <div class="infos"><br/>
+              <label>Gender></label>
+              <label>Male<input type="radio" name="Male" value="male"></label>
+              <label>Female<input type="radio" name="Female" value="female"></label>
+              <label>Others<input type="radio" name="Others" value="others"></label><br/>
+           <legend><br/>
+            <label>Hobbies></label>
+            <label>Singing<input type="checkbox" name="Singing" value="Singing"></label>
+            <label>Dancing<input type="checkbox" name="Dancing" value="Dancing"></label>
+            <label>Sports<input type="checkbox" name="Sports" value="Sports"></label><br/>
+            </legend><br/>
+        <legend>
+            <label>College Name</label>
+            <input type="text" value="">
+            <label>University</label>
+            <input type="text" value=""><br/><br/>
+            <label>Department:</label>
+            <select>
+                <option value="cs">None</option>
+                <option value="cs">CS</option>
+                <option value="ece">ECE</option>
+                <option value="It">IT</option>
+                <option value="eee">EEE</option>    
+            </select>
+            </legend><br/>
+        <legend>
+            <label>Email:</label>
+            <input type="text">
+            <label>Phone Number:</label>
+            <input type="text">
+        </legend><br/>
+        <label>Address:</label><br/>
+        <textarea rows="2" cols="50" name="address" id="address"></textarea>
+        <br/>
+        <legend>
+            <input type="button" id="btn" value="Submit">
+            <input type="button" id="btn" value="Reset">
+        </legend>
+        </div>
+        </div>
+    </form>
+</body>
+</html>
diff --git a/Projects/Registration Form/style.css b/Projects/Registration Form/style.css
@@ -0,0 +1,31 @@
+body
+{
+    background: url(background.png);
+    height: 100vh;
+    width: 100%;
+    background-size: cover;
+    background-position: center;
+}
+form p{
+    text-align: center;
+}
+form h1{
+    text-align: center;
+}
+.container 
+{
+    text-align: center;
+}
+#btn {
+    content: '';
+    font-size: 25px;
+    background: darkcyan;
+    color: #fff;
+    font-weight: 300;
+    border: 1px solid darkcyan;
+    border-radius: 2px;
+}
+#btn:hover {
+    background: transparent;
+    color: #fff;
+}