Calculator/index.html at a8b47fa2436f9702c70c6d2571e56a3763ac2e36 · naviji/Calculator · 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
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<!DOCTYPE html>
<!-- On-screen calculator using JavaScript, HTML and CSS. -->
<html>
<head>
	<title>Calculator</title>
	<link rel="stylesheet" type="text/css" href="css/reset.css">
	<link rel="stylesheet" type="text/css" href="css/style.css">
	<link rel="stylesheet" type="text/css" href="css/fonts/stylesheet.css">
	<link href="https://fonts.googleapis.com/css?family=Black+Ops+One" rel="stylesheet">
</head>
<body>

	<div class="container">
		<div class="calculator">
			<div class="title">
				<p>CALCULATOR</p>
			</div>
			<div class="display">
				<p id="previous"></p>
				<p id="result"></p>
			</div>

			<div class="numpad">
				<table>

					<tr>
						<td><button id="hidden1"></button></td>
						<td><button id="hidden2"></button></td>
						<td><button id="clear">CLR</button></td>
						<td><button id="backspace">⌫</button></td>
					</tr>

					<tr>
						<td><button class="numbers" value="7">7</button></td>
						<td><button class="numbers" value="8">8</button></td>
						<td><button class="numbers" value="9">9</button></td>
						<td><button value="divide" class="operators" id="div">÷</button></td>
					</tr>

					<tr>
						<td><button class="numbers" value="4">4</button></td>
						<td><button class="numbers" value="5">5</button></td>
						<td><button class="numbers" value="6">6</button></td>
						<td><button value="multiply" class="operators" id="mul">×</button></td>
					</tr>

					<tr>
						<td><button class="numbers" value="1">1</button></td>
						<td><button class="numbers" value="2">2</button></td>
						<td><button class="numbers" value="3">3</button></td>
						<td><button value="subtract" class="operators" id="sub">-</button></td>
					</tr>

					<tr>
						<td><button class="numbers" value="0">0</button></td>
						<td><button class="dot" value=".">.</button></td>
						<td><button value="equal" id="equal">=</button></td>
						<td><button value="add" class="operators" id="plus">+</button></td>
					</tr>
				</table>
			</div>
		</div>
	</div>
<script type="text/javascript" src="scripts/script.js"></script>
</body>
</html>