为啥这个按钮特别大,特别突出?

为啥这个按钮特别大,特别突出?

http://img1.sycdn.imooc.com//climg/5dfd8c19093000e904580488.jpg

*{
    padding:0px;
    margin:0px;
}
div{
    width:170px;

}
#div1{
    top:60px;
    left:100px;
    position:absolute;
}
input[type="button"]{
    width:30px;
    margin-right:4px;
    margin-top:2px;


}
input[type="text"]{
    width:144px;
    background-color:#fff;
    border: 1px solid;
    text-align:right;
    padding-right: 5px;
    box-sizing:border-box;

}

input[type="button"]:hover{
    background: yellow;
    border: 1px solid;
}






<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" type="text/css" href="calc.css">
    <script type="text/javascript" src="index.js"></script>
    <script type="text/javascript" src="js/mooc.js"></script>

</head>
<body onload="init(),init_imooc()">
    <div id="div1">
        <div id="div2">
            <input type="text" name="num" id="num"/>
        </div>
        <div id="div3">
            <input type="button" name="" id="" value="C"/>
            <input type="button" name="" id="" value="⬅"/>
            <input type="button" name="" id="" value="+/-"/>
            <input type="button" name="" id="" value="/"/>
            <input type="button" name="" id="" value="1"/>
            <input type="button" name="" id="" value="2"/>
            <input type="button" name="" id="" value="3"/>
            <input type="button" name="" id="" value="*"/>
            <input type="button" name="" id="" value="4"/>
            <input type="button" name="" id="" value="5"/>
            <input type="button" name="" id="" value="6"/>
            <input type="button" name="" id="" value="-"/>
            <input type="button" name="" id="" value="7"/>
            <input type="button" name="" id="" value="8"/>
            <input type="button" name="" id="" value="9"/>
            <input type="button" name="" id="" value="+"/>
            <input type="button" name="" id="" value="0"/>
            <input type="button" name="" id="" value="."/>
            <input type="button" name="" id="" value="="/>
            <input type="button" name="" id="imooc" value="m"/>
        </div>
    </div>
    
</body>














function init(){
    var num=document.getElementById("num");
    num.value=0;
    num.disabled="disabled";

    var oButton=document.getElementsByTagName("input");
    var btn_num1;
    var fh;                
    for(var i=0;i<oButton.length;i++){
        oButton[i].onclick=function(){
            if(!isNaN(this.value)){
                /*num.value=(num.value+this.value)*1*/
                if(isNull(num.value)){
                    num.value=this.value;
                }else{
                    num.value=num.value+this.value;
            }
        }else{
            // var btn_num=this.value;
            switch (this.value) {
                        case "C":
                            num.value=0;
                        break;
                        case "⬅":
                            num.value=back(num.value);
                        break;
                        case "+/-":
                            num.value=sign(num.value);
                        break;
                        case "/":
                            btn_num1=num.value*1;
                            num.value=0;
                            fh="/";
                        break;
                        case "*":
                            btn_num1=num.value*1;
                            num.value=0;
                            fh="*";
                        break;
                        case "-":
                            btn_num1=num.value*1;
                            num.value=0;
                            fh="-";
                        break;
                        case "+":
                            btn_num1=num.value*1;
                            num.value=0;
                            fh="+";
                        break;
                        case "m":
                            
                        break;
                        case "=":
                        switch(fh){
                                case "+":
                                num.value=btn_num1+num.value*1;
                                break;
                                case "-":
                                num.value=btn_num1-num.value*1;
                                break;
                                case "*":
                                num.value=btn_num1*num.value*1;
                                break;
                                case "/":
                                    if(num.value*1==0){
                                        num.value=0;
                                        alert("除数不能为零!");
                                    } else {
                                        num.value=btn_num1/num.value*1;
                                    }
                                
                                break;
                            }
                

                        break;
                        case ".":
                            num.value=dec_number(num.value);
                        break;
                
                }
            }
        }
    }

}
function sign(n){
    // if (n.indexOf("-")==-1) {
    //     n="-"+n
    // } else {
    //     n=n.substring(1,n.length);
    // }
    n=n*(-1);
        return n;
}


function back(n){
    n=n.substring(0,n.length-1);
    if (isNull(n)) {
        n=0;
    } 
    return n;

}

function isNull(n){
    if(n=="0" || n.length==0){
        return true;
    }else{
        return false;
    }    
}

function dec_number(n){
    if (n.indexOf(".")==-1) {
        n=n+".";
    } 
    return n;
}






function init_imooc(){
    document.getElementById("imooc").onclick=function(){
        window.location.href="http://www.imooc.com";
        }
}


正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

1回答
好帮手慕柯南 2019-12-21 11:40:48

同学你好!

你这里的箭头应该是个图标,而不是特殊字符,所以导致按钮较大。不是很清楚同学使用的是什么输入法,你可以切换至微软盘下输入,老师这里以搜狗为例

http://img1.sycdn.imooc.com//climg/5dfd9391092a095a04760455.jpg

然后点击下面的左箭头

http://img1.sycdn.imooc.com//climg/5dfd939609f25f3e03470134.jpg

如果不可以你可以,直接粘贴下面的左箭头使用

如果我的回答解决了你的疑惑,请采纳,祝学习愉快~

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师