Question

我正在尝试在HTML文件中创建一个小输入。

以下是相关代码：

<input type="number" id="inputNum" class="input-group" placeholder="number" value="1"> <br />

使用bootstrap库。

问题是我的输入很广。我希望我的输入宽度约为10％（在这个字段中只接受一个数字，我需要它很小）。

我怎样才能做到这一点？

Answer 1

首先需要制作一个容器或行：

<div class="row">
     <div class='col-sm-5'>
        <input type="text" class='form-control ' ></input>
     </div>
</div>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet"/>

<div class="container">
	    <div class="row">
	        <div class='col-sm-3'>
	            <input type="text" class='form-control '>
	        </div>
		</div>
</div>

查看FullScreen中的示例！

Answer 2

<div class="col-md-1">

<input type="number" id="inputNum" class="input-group" placeholder="number" value="1"> </br>

</div>

HTML＆amp; Bootstrap /输入宽度小

2 个答案: