《css+div做的简单windows计算器》由会员分享,可在线阅读,更多相关《css+div做的简单windows计算器(7页珍藏版)》请在金锄头文库上搜索。
1、刚开始学css+div,想做个windows计算器,弄了一上午,总算是做出来了,现在发下自己一上午的成果,哈哈,还有很多不完善的地方,仅供参考。为了排版开始加了很多边框,最后在代码里面都注释掉了,不过IE不知道什么原因,/的注释都被显示出来了。(360的结果)(IE的结果)(360最终结果)html跟css的代码如下:jisuanqi.html计算器计算器-x编辑(E)查看(V)帮助(H)MCMRMSM+BackspaceCEC789/sqrt456*%123-1/x0+/-.+=jisuanqi.cssbodytext-align:center;#jisuanqifloat:left;mar
2、gin:0 25%;padding:0px;width:754px;height:754px;border:2px solid 000000;#headerfloat:left;width:754px;background:red;#header_leftfloat:left;margin:0px 30px;font-size:50px;width:300px;line-height:100px;#header_rightfloat:right;margin-right:30px;width:100px;#header_right ulfloat:left;list-style:none;te
3、xt-align:center;#header_right ul lifloat:left;border:1px solid 000000;background:000000;line-height:50px;font-size:40px;margin-top:10px;#zhutifloat:left;background:#ffffff;margin:0px;padding:0px;#zhuti_topfloat:left;#zhuti_top1float:left;width:750px;line-height:45px;/border:2px solid blue;#zhuti_top
4、1 ulfloat:left;list-style:none;width:450px;#zhuti_top1 ul lifloat:left;margin-left:10px;margin-right:5px;width:125px;#zhuti_top2float:left;width:720px;height:50px;margin:0px 10px;border:2px solid 000000;background:#ffffff;#zhuti_leftfloat:left;width:155px;height:470px;#zhuti_left #fangkuangfloat:lef
5、t;width:120px;height:75px;margin:15px 15px;border:2px solid #eeeeee;background:#eeeeee;#zhuti_left .anniufloat:left;width:130px;line-height:70px;margin:10px 10px;border:2px solid #eeeeee;color:red;background:#eeeeee;#zhuti_rightfloat:right;width:550px;height:480px;margin:5px 5px;/border:2px solid re
6、d;#zhuti_right1float:left;/border:2px solid yellow;#zhuti_right1 .daanniufloat:left;line-height:75px;width:150px;margin:12px 10px;color:red;border:2px solid #eeeeee;background:#eeeeee;#zhuti_right2float:left;width:530px;height:360px;text-align:center;margin:10px 0px;/border:2px solid blue;#zhuti_right2 .anniufloat:left;width:80px;line-height:75px;margin:6px 10px;border:2px solid #eeeeee;color:blue;background:#eeeeee;