-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathQuestion4.html
131 lines (130 loc) · 6.01 KB
/
Question4.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
<!DOCTYPE html>
<html lang="en">
<head>
<style>
<style>
body {
font-family: sans-serif;
}
.form-container {
width: 30%;
margin: 0 auto;
padding: 20px;
border: 2px solid #ccc;
border-radius: 10px;
}
.form-title {
margin-bottom: 20px;
font-size: 24px;
font-weight: bold;
text-align: center;
}
.form-group {
margin-bottom: 15px;
}
.form-group label {
display: block;
margin-bottom: 5px;
font-weight: bold;
}
.form-control {
width: 40%;
padding: 8px;
border: 1px solid #ccc;
border-radius: 5px;
box-sizing: border-box;
}
.form-control:focus {
outline: none;
border-color: #5c9ded;
}
.form-checkbox {
margin-right: 10px;
}
.terms-container {
margin-bottom: 20px;
}
.submit-btn {
display: inline-block;
padding: 10px 20px;
border: none;
border-radius: 5px;
background-color: #5c9ded;
color: #d1cbcb;
cursor: pointer;
}
.clear-btn {
display: inline-block;
margin-left: 10px;
padding: 10px 20px;
border: 1px solid #5c9ded;
border-radius: 5px;
background-color: transparent;
color: #5c9ded;
cursor: pointer;
}
</style>
</style>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div style="margin-bottom: 20px; font-size: 24px; font-weight: bold; text-align: center;">Academic Information</div>
<form>
<div style="margin-bottom: 15px;">
<label for="degree" style="display: block; margin-bottom: 5px; font-weight: bold;">Degree</label>
<select id="degree" style="width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box;">
<option value="">Select Degree</option>
<option value="mba">Masters of Business Administration</option>
<option value="mit">Masters in Information Technologies</option>
</select>
</div>
<div style="margin-bottom: 15px;">
<label for="student-id" style="display: block; margin-bottom: 5px; font-weight: bold;">Student ID</label>
<input type="text" id="student-id" style="width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box;" placeholder="Enter Student ID">
</div>
<div style="margin-bottom: 15px;">
<label for="classes" style="display: block; margin-bottom: 5px; font-weight: bold;">Classes Attended</label>
<select id="classes" style="width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box;" multiple>
<option value="geography">Geography</option>
<option value="mathematics">Mathematics</option>
<option value="english">English</option>
</select>
</div>
</div>
<div style="width: 80%; margin: 0 auto; padding: 20px; border: 2px solid #ccc; border-radius: 10px;">
<div style="margin-bottom: 20px; font-size: 24px; font-weight: bold; text-align: center;">Personal Details</div>
<div style="margin-bottom: 15px;">
<label for="first-name" style="display: block; margin-bottom: 5px; font-weight: bold;">First Name</label>
<input type="text" id="first-name" style="width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box;" placeholder="Enter First Name">
</div>
<div style="margin-bottom: 15px;">
<label for="last-name" style="display: block; margin-bottom: 5px; font-weight: bold;">Last Name</label>
<input type="text" id="last-name" style="width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box;" placeholder="Enter Last Name">
</div>
<div style="margin-bottom: 15px;">
<label style="display: block; margin-bottom: 5px; font-weight: bold;">Gender</label><br>
<label for="male" class="form-checkbox">
<input type="radio" id="male" name="gender" value="male"> Male
</label>
<label for="female" class="form-checkbox">
<input type="radio" id="female" name="gender" value="female"> Female
</label>
</div>
<div style="margin-bottom: 15px;">
<label for="email" style="display: block; margin-bottom: 5px; font-weight: bold;">Email</label>
<input type="email" id="email" style="width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box;" placeholder="Enter Email">
</div>
</div>
<div style="width: 80%; margin: 0 auto; padding: 20px; border: 2px solid #ccc; border-radius: 10px;">
<div style="margin-bottom: 20px;">
<label for="terms" style="display: block; margin-bottom: 5px; font-weight: bold;">TERMS AND CONDITION</label>
<textarea id="terms" style="width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box;" rows="4" placeholder="Write your comments here"></textarea>
</div>
<div>
<button type="submit" class="submit-btn">Send Form</button>
<button type="submit" class="clear-btn">Clear Form</button>
</div>
</body>
</html>