您现在的位置是:网站首页> 编程资料编程资料

jQuery实现简易的计算器_jquery_

2023-05-24 447人已围观

简介 jQuery实现简易的计算器_jquery_

本文实例为大家分享了jQuery实现简易的计算器的具体代码,供大家参考,具体内容如下

布局如下:

css代码

#d1{     width: 400px;     height: 500px;     /*background-color: #A9A9A9;*/     float: left;     margin: 20px 0px 0px 500px;     font-size: 30px;     font-weight: bold;     font-family: 宋体;     text-align: center;     line-height: 70px;     background:url("../img/1 (20).jpg");     background-repeat:no-repeat;     background-size:400px 500px; } #d2{     width: 100%;     height: 4%;     color: aqua;     float: left;     border:0px red solid;     text-align: left;     line-height: 18px;     font-size: 20px;     font-family: "微软雅黑";      } #d3{     width: 100%;     height: 10%;     color: aqua;     float: left;     border:0px red solid;     text-align: left;     line-height: 18px;     margin-top: 3px;     margin-bottom: 9px;     opacity: 0.8; } .c1{     width: 22.1%;     height: 15%;     background-color: #FFC0CB;     cursor: pointer;     float: left;     border-radius: 12px;     margin: 0px 0px 9px 9px;     opacity: 0.8; } .c1:hover{     background-color: aqua; }

布局+jQuery:

                       计算器                            
            
● ● ●
            
                             
            
AC
            
+/-
            
%
            
÷
            
7
            
8
            
9
            
×
            
4
            
5
            
6
            
-
            
1
            
2
            
3
            
+
            
0
            
保留
            
.
            
=
                                               
    

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

-六神源码网