html
html
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
<!-- Created by ❣️TaNißha❣️ -->
<!DOCTYPE html>
<html>
<head>
<title>Calculator by..... </title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class="container">
<fieldset id="container">
<form name="calculator">
<input id="display" type="text" name="display" readonly>
<br>
<input class="button digits" type="button" value="7" onclick="calculator.display.value+='7'">
<input class="button digits" type="button" value="8" onclick="calculator.display.value+='8'">
<input class="button digits" type="button" value="9" onclick="calculator.display.value+='9'">
<input class="button mathbuttons" type="button" value="+" onclick="calculator.display.value+='+'">
<br>
<input class="button digits" type="button" value="4" onclick="calculator.display.value+='4'">
<input class="button digits" type="button" value="5" onclick="calculator.display.value+='5'">
<input class="button digits" type="button" value="6" onclick="calculator.display.value+='6'">
<input class="button mathbuttons" type="button" value="-" onclick="calculator.display.value+='-'">
<br>
<input class="button digits" type="button" value="1" onclick="calculator.display.value+='1'">
Enter to Rename, Shift+Enter to Preview
css
css
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
/* Created by ❣️TaNißha❣️ */
body {
background-color: #424242;
font-family:Tahoma;
}
.container{
display:flex;
align-items:center;
justify-content:center;
height:100vh;
width:100vw;
}
#container{
width:200px;
padding:8px 8px 20px 8px;
margin:20px auto;
background-color: #ABABAB;
border-radius:4px;
border-top:2px solid #FFF;
border-right:2px solid #FFF;
border-bottom:2px solid #C1C1C1;
border-left:2px solid #C1C1C1;
box-shadow:-3px 3px 7px rgba(0,0,.6),inset-100px rgba(255,255,255,.5);
}
Enter to Rename, Shift+Enter to Preview
js
js
1
2
3
// Created by ❣️TaNißha❣️
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run