Scribd Logo
Upload

Welcome to Scribd!

  • Calculator

    Uploaded by

    hawibolo12
    18 views2 pages
    This document contains the code for building a basic HTML calculator. It uses HTML and CSS to create a table layout with number and operator buttons. The table has 5 rows with 4 cells each to hold the input buttons for numbers 0-9, basic math operators, a decimal point, and equals sign. There is also a clear button and a result display field at the top. Styling is added with CSS to format the buttons and input fields.

    Original Description:

    Original Title

    calculator

    Copyright

    © © All Rights Reserved

    Available Formats

    TXT, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    This document contains the code for building a basic HTML calculator. It uses HTML and CSS to create a table layout with number and operator buttons. The table has 5 rows with 4 cells each to hold the input buttons for numbers 0-9, basic math operators, a decimal point, and equals sign. There is also a clear button and a result display field at the top. Styling is added with CSS to format the buttons and input fields.

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    18 views2 pages

    Calculator

    Uploaded by

    hawibolo12
    This document contains the code for building a basic HTML calculator. It uses HTML and CSS to create a table layout with number and operator buttons. The table has 5 rows with 4 cells each to hold the input buttons for numbers 0-9, basic math operators, a decimal point, and equals sign. There is also a clear button and a result display field at the top. Styling is added with CSS to format the buttons and input fields.

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 2

    <!

    DOCTYPE html>
    <html>

    <head>
    <title>HTML Calculator</title>

    <!-- For styling -->


    <style>
    table {
    border: 1px solid black;
    margin-left: auto;
    margin-right: auto;
    }

    input[type="button"] {
    width: 100%;
    padding: 20px 40px;
    background-color: green;
    color: white;
    font-size: 24px;
    font-weight: bold;
    border: none;
    border-radius: 5px;
    }

    input[type="text"] {
    padding: 20px 30px;
    font-size: 24px;
    font-weight: bold;
    border: none;
    border-radius: 5px;
    border: 2px solid black;
    }
    </style>
    </head>

    <body>

    <!-- Create table -->


    <table id="calcu">
    <tr>
    <td colspan="3">
    <input type="text" id="result">
    </td>
    <td><input type="button" value="c"></td>
    </tr>

    <tr>
    <td><input type="button" value="1"></td>
    <td><input type="button" value="2"></td>
    <td><input type="button" value="3"></td>
    <td><input type="button" value="/"></td>
    </tr>
    <tr>
    <td><input type="button" value="4"></td>
    <td><input type="button" value="5"></td>
    <td><input type="button" value="6"></td>
    <td><input type="button" value="*"></td>
    </tr>
    <tr>
    <td><input type="button" value="7"></td>
    <td><input type="button" value="8"></td>
    <td><input type="button" value="9"></td>
    <td><input type="button" value="-"></td>
    </tr>
    <tr>
    <td><input type="button" value="0"></td>
    <td><input type="button" value="."></td>
    <td><input type="button" value="="></td>
    <td><input type="button" value="+"></td>
    </tr>
    </table>
    </body>

    </html>

    You might also like