<!DOCTYPE html>
<html>
<head>
<title>Attribute calculator.html</title>
<style>
.form1 {
Background: black;
Text-align:center;
Padding-right:0px;
Border:2px solid red;
Border-radius:5px;
Padding-bottom:60px;
Padding-top:5px;
}
#display{
Background:black;
Color:white;
Border:1px solid white;
Border-radius:5px;
Margin-top:20px;
Width:195px;
Height:40px;
Padding-left:10px;
}
.h3{
Color:lightgreen;
Style:italic;
Text-shadow:3px white;
Padding-top:-10px;
}
.btndesign {
Background:white;
Color:aqua
Border:none;
Border-radius:5px;
Width:40px;
Height:30px;
Margin:6px;
Transition:0.12 px solid red;
Cursor:pointer;
}
.btndesign:hover{
Background:aqua;
Transition:0.19px;
Border:none;
}
</style>
</head>
<body>
<form name="form1" class="form1" action="attractivecalculator.html method="post">
<h2 style="color:white;text-align:center;"> NAWAZ_GUJJAR</h2>
<marquee><h3 class="h3">HTML-calculator-by-NAWAZ</h3></marquee>
<input type="text" name="answer" id="display" /><br>
<div id="btn">
<input type="button" style="border:none;" class="btndesign" value="1" onclick="form1.answer.value+='1'" />
<input type="button" style="border:none;" class="btndesign" value="2" onclick="form1.answer.value+='2'" />
<input type="button" style="border:none;" class="btndesign" value="3" onclick="form1.answer.value+='3'" />
<input type="button" style="border:none;" class="btndesign" value="4" onclick="form1.answer.value+='4'" /><br/>
<input type="button" tyle="border:none;" class="btndesign" style="border:none;" value="5" onclick="form1.answer.value+='5'" />
<input type="button" style="border:none;" class="btndesign" value="6" onclick="form1.answer.value+='6'" />
<input type="button"style="border:none;" class="btndesign" value="7" onclick="form1.answer.value+='7'" />
<input type="button" class="btndesign" value="8" style="border:none;" onclick="form1.answer.value+='8'" /><br/>
<input type="button" style="border:none;" class="btndesign" value="9" onclick="form1.answer.value+='9'" />
<input type="button" style="border:none;" class="btndesign" value="0" onclick="form1.answer.value+='0'" />
<input type="button" style="border:none;" class="btndesign" value="+" onclick="form1.answer.value+='+'" />
<input type="button" style="border:none;" class="btndesign" value="-" onclick="form1.answer.value+='-'" /><br />
<input type="button" style="border:none;" class="btndesign" value="=" onclick="form1.answer.value=eval(form1.answer.value)" />
<input type="button" style="border:none;" class="btndesign" value="C" onclick="form1.answer.value=''" />
<input type="button" style="border:none;" class="btndesign" value="/" onclick="form1.answer.value+='/'" />
<input type="button" style="border:none;" class="btndesign" value="*" onclick="form1.answer.value+='*'" />
</div>
</form>
</body>
</html>
Output :
Comments
Post a Comment