[web效果实现－2]基础计算器实现

tonyhzw

于 2018-06-13 23:10:55 发布

阅读量551

点赞数

CC 4.0 BY-SA版权

分类专栏： web开发文章标签：基础计算器

本文链接：https://blog.csdn.net/datou0529/article/details/80686557

本文展示了如何实现一个基础计算器，涵盖了加、减、乘、除及百分比等基本运算。虽然未涉及按钮效果，但已完成了核心逻辑功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

本文主要是实现了基础计算器，如加、减、乘、除、百分比、正负等，逻辑比较简单，不一一展开。目前仅实现了逻辑，按钮效果等就暂时不实现了。

效果如下：
示例1
主要代码如下：

<!doctype html>
<html>
<head>
  <style>
  .container{
    background-color: black;
    color:white;
  }
  .gray{
    background-color: gray;
    color:black;
  }
  .yellow{
    background-color: yellow;
    color:black;
  }
  .black{
    background-color: blue;
    color:white;
  }
  .result{
    height: 40px;
    line-height: 40px;
    padding-top: 60px;
    padding-right: 40px;
    padding-bottom: 10px;
    text-align: right;
  }
  .button1,.button2{
    padding:2%;
    width:17%;
    margin:2%;
    height:17%;
    border-radius: