-
Notifications
You must be signed in to change notification settings - Fork 2
/
contact.html
86 lines (83 loc) · 3.32 KB
/
contact.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
<!DOCTYPE html>
<html lang="en">
<!-- head is document metadata -->
<head>
<title>Contact Page</title>
<meta name="author" content="johannes">
<meta charset="utf8">
<link rel="stylesheet" href="styles.css">
<link rel="icon" href="graphics/img_566323.png">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Source+Code+Pro&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"
integrity="sha512-9usAa10IRO0HhonpyAIVpjrylPvoDwiPUiKdWk5t3PyolY1cOd4DSE0Ga+ri4AuTroPR5aQvXU9xC6qOPnzFeg=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>
<!-- body is document content -->
<body>
<header class="main-header">
<img class="logo" src="graphics/linux_PNG42.png">
<nav class="navigation">
<a href="index.html">Home</a>
<a href="about.html">About</a>
<a href="news.html">News</a>
<a href="contact.html">Contact</a>
</nav>
</header>
<div class="banner contact">
<h1>Contact Us</h1>
</div>
<main class="content contact">
<form id="contact-form" method="get" action="/" role="form">
<label for="username">Your name</label>
<input type="text" id="username" name="name" placeholder="Jane Smith">
<label for="useremail">Your email address</label>
<input type="email" id="useremail" name="email" placeholder="[email protected]">
<div class="checkbox">
<!-- checkbox -->
<input type="checkbox" id="marketing" name="marketing" value="true" checked>
<label for="marketing">Yes, I want to receive information about new products</label>
</div>
<div class="radio">
<!-- radio buttons -->
<input type="radio" name="origin" id="origin1" value="au" checked>
<label for="origin1">I am in Australia</label>
<input type="radio" name="origin" id="origin2" value="int">
<label for="origin2">I am outside Australia</label>
<input type="radio" name="origin" id="origin3" value="ant">
<label for="origin3">I am in Antarctica</label>
</div>
<!-- select -->
<label for="useroptions">Options</label>
<select id="useroptions" name="options">
<option value="1">Option 1</option>
<option value="2" selected>Option 2</option>
<option value="3">Option 3</option>
</select>
<label for="message">Message</label>
<textarea name="message" id="message" rows="5" cols="30" placeholder="your message to us"></textarea>
<button type="reset">
Reset
</button>
<button type="submit">Submit</button>
</form>
</main>
<footer class="footer">
<nav class="social">
<a href="https://www.facebook.com/TAFENSW/">
<i class="fa-brands fa-facebook"></i>
</a>
<a href="https://twitter.com/tafensw">
<i class="fa-brands fa-twitter-square"></i>
</a>
<a href="https://www.instagram.com/tafensw/">
<i class="fa-brands fa-instagram-square"></i>
</a>
<a href="https://www.linkedin.com/company/tafe-nsw">
<i class="fa-brands fa-linkedin"></i>
</a>
</nav>
</footer>
</body>
</html>