Distance-Converter/index.html at main · pawanraj77/Distance-Converter · GitHub

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
<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Distance Converter</title>

	<!--/ /-------- Normalize CSS --------/ /-->
	<link href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css" rel="stylesheet">

	<!--/ /-------- Google Fonts --------/ /-->
	<link href="https://fonts.googleapis.com/css?family=Oswald|PT+Sans&display=swap" rel="stylesheet">

	<!--/ /-------- My Styles --------/ /-->
	<link href="styles.css" rel="stylesheet">

	<script src="script.js" defer></script>

</head>

<body>

	<h1>Miles to Kilometers Converter</h1>

    <div class="container top">
    	<p>Type in a number of miles and click the button to convert the distance to kilometers.</p>

        <form method="post" action="somephpfile.php" id="convert">

        	<input type="text" name="distance" id="distance" placeholder="distance">
            <input type="submit" name="convertdist" value="Convert Distance">

        </form>
    </div>
    <div class="container bottom" id="answer">
    	<h2 class="invisible">Answer goes here</h2>
    </div>

    <p id="directions">Press the "K" key to switch to kilometer converstion, press the "M" key to switch to mile conversion</p>


</body>
</html>