October 13, 2020

How to Create a Calculator in HTML, CSS and Javascript | Digital Rachana

 







<html>
<head>
<title></title>
<style>
form{width: 300px; }
input{padding:10px; margin:5px; border-radius:5px}

</style>
</head>
<body>

<form name="calculator" >
<input type="textfield" name="ans" value=""><br>
<input type="button" value="1" onClick="document.calculator.ans.value+='1'">
<input type="button" value="2" onClick="document.calculator.ans.value+='2'">
<input type="button" value="3" onClick="document.calculator.ans.value+='3'">
<input type="button" value="4" onClick="document.calculator.ans.value+='4'"><br>
<input type="button" value="5" onClick="document.calculator.ans.value+='5'">
<input type="button" value="6" onClick="document.calculator.ans.value+='6'">
<input type="button" value="7" onClick="document.calculator.ans.value+='7'">
<input type="button" value="8" onClick="document.calculator.ans.value+='8'"><br>
<input type="button" value="9" onClick="document.calculator.ans.value+='9'">
<input type="button" value="-" onClick="document.calculator.ans.value+='-'">
<input type="button" value="+" onClick="document.calculator.ans.value+='+'">
<input type="button" value="*" onClick="document.calculator.ans.value+='*'"><br>
<input type="button" value="/" onClick="document.calculator.ans.value+='/'">
<input type="button" value="0" onClick="document.calculator.ans.value+='0'">
<input type="button" value="." onClick="document.calculator.ans.value+='.'">
<input type="button" value="=" onClick="document.calculator.ans.value=eval(document.calculator.ans.value)"><br>
<input type="reset" value="Reset" width="">

</form>

</body>
</html>