Source Code of Calculator.
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="UTF-8"/>
<link rel="stylesheet" href="" type="text/css"/>
</head>
<body>
<div class="div1">
<div class="div3">
<div class="div2">
<font color= "white" class="result">0123456789</font>
</div>
</div>
<div class="btn">
<button onClick="" class="sym">C</button>
<button onClick="" class="sym">00</button>
<button onClick="" class="sym">%</button>
<button onClick="" class="sym">^</button>
<br>
<button onClick="" class="num">7</button>
<button onClick="" class="num">8</button>
<button onClick="" class="num">9</button>
<button onClick="" class="sym">÷</button>
<br>
<button onClick="" class="num">4</button>
<button onClick="" class="num">5</button>
<button onClick="" class="num">6</button>
<button onClick="" class="sym">×</button>
<br>
<button onClick="" class="num">1</button>
<button onClick="" class="num">2</button>
<button onClick="" class="num">3</button>
<button onClick="" class="sym">-</button>
<br>
<button onClick="" class="num">0</button>
<button onClick="" class="num">.</button>
<button onClick="" class="num">=</button>
<button onClick="" class="sym">+</button>
</div>
</div>
<style>
.div1{
background-color:#ABAAA7;
width:350px;
height:540px;
border:solid;
border-width:5px;
border-radius:20px;
box-shadow: 4px 7px #202714;
}
.div2{
background-color:#3F393B;
width:328px;
height:70px;
border:solid;
border-radius:20px;
position:relative;
top:10px; left:3px;
padding:0px;
margin:0px;
}
.result{
padding:13px;
font-size:55px;
}
.btn{
position:relative;
top:30px;
padding:5px;
}
.num{
background-color:#1B393B;
color:#ffffff;
width:70px;
height:70px;
font-size:50px;
margin:5px;
box-shadow:2px 3px #ffffff;
}
.sym{
background-color:#703135;
color:#ffffff;
width:70px;
height:70px;
font-size:50px;
margin:5px;
box-shadow:2px 3px #ffffff;
}
.div3{
background-color:#000000;
width:340px;
height:90px;
border:solid;
border-radius:20px;
position:relative;
top:10px; left:3px;
padding:0px;
margin:0px;
box-shadow:2px 3px #ffffff;
}
</style>
</body>
</html>
Wow 😲 nice code
ReplyDeleteAmazing work,nice code
ReplyDeleteAmazing work, nice code
ReplyDeleteWow amazing,nice code
ReplyDelete