Basic Gui Calculator

<!DOCTYPE html>

<html lang="en">

<head>

    <title>Calculator</title>

    <style>

        table,tr,td{

            border-radius: 3px;

            background-color: cadetblue;

        }

        table{

            border: 2px solid black;

        }

        td{

            width:25px;

        }

        button{

            width: 25px;

            background-color: green;

            color: aliceblue;

            border: 2px inset rgb(0, 0, 0);

        }

        input{

            border: 2px solid black;

            width: 85px;

            text-align: right;

            background-color: rgb(195, 178, 135)  ;

        }

        #eq{

            width: 60px;

        }

    </style>

</head>

<body>

   <center> <div>

<table >

    <h1>Calculator</h1>

    <tr>

        <td colspan="3"><input type="text"  id="display"></td>

        <td><button id="cl" onclick="cl()" value="">C</button></td>

    </tr>

    <tr align="center">

        <td><button id="b7" value="7" onclick="seven()">7</button></td>

       <td><button id="b8" value="8" onclick="eight()">8</button></td>

       <td><button id="b9" value="9" onclick="nine()">9</button></td>

        <td><button id="divi" value="/" onclick="divi()">/</button></td>

    </tr>

    <tr align="center">

        <td><button id="b4" value="4" onclick="four()">4</button></td>

       <td><button id="b5" value="5" onclick="five()">5</button></td>

       <td><button id="b6" value="6" onclick="six()">6</button></td>

        <td><button id="mul" value="*" onclick="mul()">X</button></td>

    </tr>

     <tr align="center">

        <td><button id="b1" value="1" onclick="one()">1</button></td>

       <td><button id="b2" value="2" onclick="two()">2</button></td>

       <td><button id="b3" value="3" onclick="three()">3</button></td>

        <td><button id="sub" value="-" onclick="sub()">-</button></td>

    </tr>

    <tr align="center">

       <td><button id="b0" value="0" onclick="zero()">0</button></td>

       <td colspan="2"  ><button id="eq" onclick="equal()">=</button></td>

        <td><button id="add" value="+" onclick="add()">+</button></td>

    </tr>

</table></div></center>

<script>

function zero(){

    var a =document.getElementById('b0').value;

    document.getElementById('display').value+=a;

}

function one(){

    var a =document.getElementById('b1').value;

    document.getElementById('display').value+=a;

}

function two(){

    var a =document.getElementById('b2').value;

    document.getElementById('display').value+=a;

}

function three(){

    var a =document.getElementById('b3').value;

    document.getElementById('display').value+=a;

}

function four(){

    var a =document.getElementById('b4').value;

    document.getElementById('display').value+=a;

}

function five(){

    var a =document.getElementById('b5').value;

    document.getElementById('display').value+=a;

}

function six(){

    var a =document.getElementById('b6').value;

    document.getElementById('display').value+=a;

}

function seven(){

    var a =document.getElementById('b7').value;

    document.getElementById('display').value+=a;

}

function eight(){

    var a =document.getElementById('b8').value;

    document.getElementById('display').value+=a;

}

function nine(){

    var a =document.getElementById('b9').value;

    document.getElementById('display').value+=a;

}

function add(){

    var a =document.getElementById('add').value;

    document.getElementById('display').value+=a;

}

function sub(){

    var a =document.getElementById('sub').value;

    document.getElementById('display').value+=a;

}

function mul(){

    var a =document.getElementById('mul').value;

    document.getElementById('display').value+=a;

}

function divi(){

    var a =document.getElementById('divi').value;

    document.getElementById('display').value+=a;

}

function cl(){

    var a =document.getElementById('cl').value;

    document.getElementById('display').value=a;

}

function equal(){

    var a =eval(document.getElementById('display').value);

    document.getElementById('display').value=a;

}

</script>

</body>

</html>