DEV Community

Cover image for CALCULADORA BÁSICA EN HTML
Victor Alvarado
Victor Alvarado

Posted on

CALCULADORA BÁSICA EN HTML

Código
<!DOCTYPE html>
<html lang="es">
   <head>
      <meta charset="utf-8">
      <title>Calculadora</title>
   </head>
   <body bgcolor="DBFC95">
      <form name="calculator">
         <table bordercolor="green" border='3' width="200" align="center" bgcolor="A9DCDA">
            <tr>
               <td>
                  </center>
                  <fieldset style="border:2px groove #ccc; background:#A9DCDA;">
                     <legend>
                        <b>CALCULADORA BASICA</b>
                     </legend>
                     <input type="textfield" name="ans" value="" style='width:100%; height:25px'>
                     <br>
                     <input style='width:23%; height:35px' type="button" value="1" onClick="document.calculator.ans.value+='1'"/>
                     <input style='width:23%; height:35px' type="button" value="2" onClick="document.calculator.ans.value+='2'"/>
                     <input style='width:23%; height:35px' type="button" value="3" onClick="document.calculator.ans.value+='3'"/>
                     <input style='width:23%; height:35px' type="button" value="+" onClick="document.calculator.ans.value+='+'"/>
                     <br>
                     <input style='width:23%; height:35px' type="button" value="4" onClick="document.calculator.ans.value+='4'"/>
                     <input style='width:23%; height:35px' type="button" value="5" onClick="document.calculator.ans.value+='5'"/>
                     <input style='width:23%; height:35px' type="button" value="6" onClick="document.calculator.ans.value+='6'"/>
                     <input style='width:23%; height:35px' type="button" value="-" onClick="document.calculator.ans.value+='-'"/>
                     <br>
                     <input style='width:23%; height:35px' type="button" value="7" onClick="document.calculator.ans.value+='7'"/>
                     <input style='width:23%; height:35px' type="button" value="8" onClick="document.calculator.ans.value+='8'"/>
                     <input style='width:23%; height:35px' type="button" value="9" onClick="document.calculator.ans.value+='9'"/>
                     <input style='width:23%; height:35px' type="button" value="*" onClick="document.calculator.ans.value+='*'"/>
                     <br>
                     <input style='width:23%; height:35px' type="button" value="0" onClick="document.calculator.ans.value+='0'"/>
                     <input style='width:23%; height:35px; color:#FF3604' type="reset" value="C">
                     <input style='width:23%; height:35px' type="button" value="." onClick="document.calculator.ans.value+='.'"/>
                     <input style='width:23%; height:35px' type="button" value="/" onClick="document.calculator.ans.value+='/'"/>
                     <br>
                     <input style='width:100%; height:35px;' type="button" value="=" onClick="document.calculator.ans.value=eval(document.calculator.ans.value)"/> 
                  </fieldset>
                  </center> 
               </td>
            </tr>
         </table>
      </form>
   </body>
</html>
Enter fullscreen mode Exit fullscreen mode

Top comments (0)