<!DOCTYPE html>
<html>
<head>
<tittle>calculator</tittle>
<style>
table{
border:20px solid blue;
background:black;
border-radius:30px;
height:auto;
}
input[type=button]{
color:white;
height:100px;
width:60px;
background:blue;
}
input[type=text]{
height:100px;
width:308px;
background:blue;
border-radius:20px;
color:red;
}
input:active[type=button]{
background:red;
border:black 10px solid;
border-radius:20px;
}
body{
background:rgb(40 60 80);
}
</style>
</head>
<body>
<table>
<tr>
<td>
<input type =”text” id=”result” disabled>
</td>
</tr>
<tr>
<td>
<input type=”button” value=”1″ onclick=”display(‘1’)”>
<input type=”button” value=”2″ onclick=”display(‘2’)”>
<input type=”button” value=”3″ onclick=”display(‘3’)”>
<input type=”button” value=”/” onclick=”display(‘/’)”>
<input type=”button” value=”(” onclick=”display(‘(‘)”>
</td>
</tr>
<tr>
<td>
<input type=”button” value=”4″ onclick=”display(‘4’)”>
<input type=”button” value=”5″ onclick=”display(‘5’)”>
<input type=”button” value=”6″ onclick=”display(‘6’)”>
<input type=”button” value=”*” onclick=”display(‘*’)”>
<input type=”button” value=”)” onclick=”display(‘)’)”>
</td>
</tr>
<tr>
<td>
<input type=”button” value=”7″ onclick=”display(‘7’)”>
<input type=”button” value=”8″ onclick=”display(‘8’)”>
<input type=”button” value=”9″ onclick=”display(‘9’)”>
<input type=”button” value=”-” onclick=”display(‘-‘)”>
<input type=”button” value=”^” onclick=”display(‘^’)”>
</td>
</tr>
<tr>
<td>
<input type=”button” value=”.” onclick=”display(‘.’)”>
<input type=”button” value=”0″ onclick=”display(‘0’)”>
<input type=”button” value=”=” onclick=”calculate()”>
<input type=”button” value=”+” onclick=”display(‘+’)”>
<input type =”button” value=”C” onclick=”clearScreen()” id=”clear”>
</td>
</tr>
</table>
<script>
function display(value){
document.getElementById(“result”).value += value;
}
function clearScreen(){
document.getElementById(“result”).value = “”;
}
function calculate(){
let p=
document.getElementById(“result”).value;
let q= eval(p);
document.getElementById(“result”).value = q;
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<tittle>calculator</tittle>
<style>
table{
border:20px solid blue;
background:black;
border-radius:30px;
height:auto;
}
input[type=button]{
color:white;
height:100px;
width:60px;
background:blue;
}
input[type=text]{
height:100px;
width:308px;
background:blue;
border-radius:20px;
color:red;
}
input:active[type=button]{
background:red;
border:black 10px solid;
border-radius:20px;
}
body{
background:rgb(40 60 80);
}
</style>
</head>
<body>
<table>
<tr>
<td>
<input type =”text” id=”result” disabled>
</td>
</tr>
<tr>
<td>
<input type=”button” value=”1″ onclick=”display(‘1’)”>
<input type=”button” value=”2″ onclick=”display(‘2’)”>
<input type=”button” value=”3″ onclick=”display(‘3’)”>
<input type=”button” value=”/” onclick=”display(‘/’)”>
<input type=”button” value=”(” onclick=”display(‘(‘)”>
</td>
</tr>
<tr>
<td>
<input type=”button” value=”4″ onclick=”display(‘4’)”>
<input type=”button” value=”5″ onclick=”display(‘5’)”>
<input type=”button” value=”6″ onclick=”display(‘6’)”>
<input type=”button” value=”*” onclick=”display(‘*’)”>
<input type=”button” value=”)” onclick=”display(‘)’)”>
</td>
</tr>
<tr>
<td>
<input type=”button” value=”7″ onclick=”display(‘7’)”>
<input type=”button” value=”8″ onclick=”display(‘8’)”>
<input type=”button” value=”9″ onclick=”display(‘9’)”>
<input type=”button” value=”-” onclick=”display(‘-‘)”>
<input type=”button” value=”^” onclick=”display(‘^’)”>
</td>
</tr>
<tr>
<td>
<input type=”button” value=”.” onclick=”display(‘.’)”>
<input type=”button” value=”0″ onclick=”display(‘0’)”>
<input type=”button” value=”=” onclick=”calculate()”>
<input type=”button” value=”+” onclick=”display(‘+’)”>
<input type =”button” value=”C” onclick=”clearScreen()” id=”clear”>
</td>
</tr>
</table>
<script>
function display(value){
document.getElementById(“result”).value += value;
}
function clearScreen(){
document.getElementById(“result”).value = “”;
}
function calculate(){
let p=
document.getElementById(“result”).value;
let q= eval(p);
document.getElementById(“result”).value = q;
}
</script>
</body>
</html>
Deon Dennis code-xombi 