Skip to content

Commit a00382e

Browse files
mandipsangermandipsanger
committed
form control initial version
1 parent 3e0a907 commit a00382e

1 file changed

Lines changed: 89 additions & 24 deletions

File tree

‎Form-Controls/index.html‎

Lines changed: 89 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,93 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
<head>
4-
<meta charset="utf-8" />
5-
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
6-
<title>My form control exercise</title>
7-
<meta name="description" content="" />
8-
<meta name="viewport" content="width=device-width, initial-scale=1" />
9-
</head>
10-
<body>
11-
<header>
12-
<h1></h1>
13-
</header>
14-
<main>
15-
<form>
16-
<!-- write your html here-->
17-
<!--
3+
4+
<head>
5+
<meta charset="utf-8" />
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
7+
<title>My form control</title>
8+
<meta name="description" content="F" />
9+
<meta name="viewport" content="width=device-width, initial-scale=1" />
10+
</head>
11+
<style>
12+
fieldset {
13+
background-color: rgba(38, 95, 100, 0.798)
14+
}
15+
16+
legend {
17+
background-color: rgb(255, 255, 255);
18+
color: rgb(white);
19+
padding: 5px 10px;
20+
}
21+
22+
label {
23+
margin: 10px;
24+
color: rgb(white);
25+
padding: 10px 20px;
26+
}
27+
28+
input {
29+
margin: 40px;
30+
}
31+
</style>
32+
</head>
33+
34+
<body>
35+
<header>
36+
<h1></h1>
37+
</header>
38+
<main>
39+
<form>
40+
<form action="/action_page.php"></form>
41+
42+
<!-- write your html here-->
43+
<!--
1844
try writing out the requirements first as comments
1945
this will also help you fill in your PR message later-->
20-
</form>
21-
</main>
22-
<footer>
23-
<!-- change to your name-->
24-
<p>By mandip work</p>
25-
</footer>
26-
</body>
27-
</html>
28-
""
46+
<div>
47+
<label for="firstname"> First name </label>
48+
<input type="text" id="First-name" name="first-name" />
49+
</div>
50+
<div>
51+
<label for="lastname"> Last name </label>
52+
<input type="text" id="Last-name" name="last-name" />
53+
</div>
54+
<div>
55+
<label for="email"> Email </label>
56+
<input type="email" id="email" name="email" />
57+
</div>
58+
<fieldset>
59+
<legend>Please select your color</legend>
60+
<datalist id="color">
61+
<option value="Black">
62+
<option value="Beige">
63+
<option value="Red">
64+
</datalist>
65+
<input type="radio" id="Black" name="Black" value="Black">
66+
<label for="Black">Black</label>
67+
<input type="radio" id="Beige" name="Beige" value="Beige">
68+
<label for="Beige"">Beige</label>
69+
<input type=" radio" id="Red" name="Red" value="Red">
70+
<label for="Red">Red</label>
71+
<br>
72+
<legend> Please select a size </legend>
73+
74+
</br>
75+
<label for="Size">Choose a size:</label>
76+
<select name="Size" id="Size">
77+
<option value="">Extra Small</option>
78+
<option value="small">Small</option>
79+
<option value="medium">Medium</option>
80+
<option value="large">Large</option>
81+
<br>
82+
<input type="submit" value="Submit">
83+
<br />
84+
</select>
85+
</fieldset>
86+
</form>
87+
</main>
88+
<footer>
89+
<p>By Mandip</p>
90+
</footer>
91+
</body>
92+
93+
</html>

0 commit comments

Comments
 (0)