-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
69 lines (69 loc) · 3.44 KB
/
index.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
<!DOCTYPE html>
<html lang='en'>
<head>
<title>Space Survey Form</title>
<meta charset='UTF-8'/>
<link rel='stylesheet' href='styles.css'/>
</head>
<body>
<div class="heading">
<h1 id='title'>Space Survey Form</h1>
<p id='description'>It is all about space !</p>
</div>
<form>
<div id='content1'>
<label id='name-label' for='name'>Name:</label><br><br>
<input id='name' type='text' required placeholder=' Enter your name' class="box"><br><br>
<label id='email-label' for='email'>Email:</label><br><br>
<input id='email' type='email' required placeholder=' Enter your email' class="box"><br><br>
<label id='number-label' for='age'>Age (optional):</label><br><br>
<input id='age' type='number' min='13' max='120' placeholder=' Age' class="box"><br><br>
<label for="gender">What is your gender?</label><br><br>
<div id="option1">
<select id="gender" name="gender">
<option>Select Your Gender</option>
<option>Male</option>
<option>Female</option>
<option>Other</option>
</select>
</div>
<br>
<label>Which option best describes your current role?</label><br><br>
<div id="option2">
<select id="role" name="role">
<option>Select Your Role</option>
<option>Student</option>
<option>Full Time Job</option>
<option>Full Time Learner</option>
<option>Prefer Not to say</option>
<option>Other</option>
</select>
<br><br>
</div>
<br>
<label id="head1">Can you envision a scenario where someone presents you with the opportunity to embark on a space voyage, knowing that there is a 50% chance of not returning alive? Would you dare to seize that chance?</label><br><br>
<input type='radio' name='radio' value='1' class='larger' /> Yes<br><br>
<input type='radio' name='radio' value='2' class='larger' /> Maybe<br><br>
<input type='radio' name='radio' value='3' class='larger' /> Absolutely not<br><br>
<label id="head2">What's your favourite solar system planet?</label><br><br>
<div class="content2">
<input type='checkbox' value='checkbox' class='larger'><label> Mercury</label><br><br>
<input type='checkbox' value='checkbox' class='larger'><label> Venus</label><br><br>
<input type='checkbox' value='checkbox' class='larger'><label> Earth</label><br><br>
<input type='checkbox' value='checkbox' class='larger'><label> Mars</label><br><br>
<input type='checkbox' value='checkbox' class='larger'><label> Jupiter</label><br><br>
<input type='checkbox' value='checkbox' class='larger'><label> Saturn</label><br><br>
<input type='checkbox' value='checkbox' class='larger'><label> Uranus</label><br><br>
<input type='checkbox' value='checkbox' class='larger'><label> Neptune</label><br><br>
</div>
<div class="content3">
<label for="favorite-planet">What is your favorite planet and why? (Describe it for us)</label><br>
<textarea id="favorite-planet" rows='10' cols='30' placeholder=' My favorite planet is...'></textarea>
</div>
<div class="btn">
<input type='submit' id='submit' value='Submit'>
</div>
</div>
</form>
</body>
</html>