如何更改输入的数值的文本字段大小?

时间:2013-12-09 17:08:22

标签: javascript html twitter-bootstrap

enter image description here


这是我的注册表单UI。如您所见,输入数字值的文本字段(Service_fee,Supplier_price,Total)将隐藏输入值的一半。我使用bootsrap来设计这个UI。我尝试使用input-large更改txtfield的类属性。
** **   
但仍然完整的价值没有显示.. :( 以下是我的代码。请帮我..

     <body>

           <div class="container">
             <form action="MobilePhoneRepairing.php" method="POST" class="form-inline">
                <h1 class="font">Mobile Phone Registration</h1>          
          <div class="navbar">
                <div class="navbar-inner">
                    <div class="container">
                        <ul class="nav">
                            <li class="active"><a href="#">Home</a></li>
                            <li><a href="#">Projects</a></li>
                            <li><a href="#">Services</a></li>
                            <li><a href="#">Downloads</a></li>
                            <li><a href="#">About</a></li>
                            <li><a href="#">Contact</a></li>
                        </ul>
                    </div>
                </div>
            </div>

             <div class="span10" >
                <div class="control-group form-horizontal">
                    <p>
                        <label class="floated" for="sdate"><b>Select Date :</b></label>

                        <input type="date" name="sdate" id="sdate" class="input-medium" />
                        <br class="clear"/>
                    </p>
                </div>
                <div class="control-group form-inline">
                    <p>  
                        <label class="floated" for="model_no"><b>Model no :</b></label>
                        <input type="text" name="model_no" id="model_no" class="input-medium" placeholder="Enter Modle No" />
                        <br class="clear" />
                    </p>
                </div>
                <div class="control-group form-inline">
                    <p>  
                        <label class="floated" for="service_fee"><b>Service fee :</b></label>
                        <input type="number" name="service_fee" id="service_fee" class="input-medium" />
                        <br class="clear" />
                    </p>
                </div>
                <div class="control-group form-inline">
                    <p>  
                        <label class="floated" for="sp_name"><b>Supplier name :</b></label>
                        <input type="text" name="sp_name" id="sp_name" class="input-medium" placeholder="Enter Supplier name " />
                        <br class="clear" />
                    </p>
                </div>
                <div class="control-group form-inline">
                    <p>  
                        <label class="floated" for="sp_price"><b>Supplier price :</b></label>
                        <input type="number" name="sp_price" id="sp_price" class="input-medium"  onkeyup="doMath();"/>
                        <br class="clear" />
                    </p>
                </div>
                <div class="control-group form-inline">
                    <p>  
                        <label class="floated" for="description"><b>Description :</b></label>
                        <textarea class="textarea" name="description" rows="2" cols="12" placeholder="Enter item description"></textarea>
                        <br class="clear" />
                    </p>
                </div>
                <div class="control-group form-inline">
                    <p>  
                        <label class="floated " for="total"><b>Total :</b></label>
                        <input type="number" name="total" id="total" class="input-medium" />
                        <br class="clear" />
                    </p>
                </div>
                <div class="control-group form-inline">
                    <p>
                        <label class="floated"> &nspar; </label>

                        <input type="submit" class="btn-info " name="save_data" value="Save" id='savedata'  />
                        <input type="reset" class="btn-primary " name="reset" value="Reset Form" id='reset' />
                        <br class="clear"/>
                    </p>
                </div>
            </div>
        </form>      
    </div>
</body>

1 个答案:

答案 0 :(得分:0)

使用CSS添加自定义高度:

.input-medium{
   height: 35px;
}

如果这不适合您,请尝试使用“!important”:

.input-medium{
   height: 35px !important;
}

希望它有所帮助!