<分区>
编辑问题以包含 desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem .这将有助于其他人回答问题。
关闭 8 年前。
html - 将输入字段的顺序从垂直更改为水平？
这是我的表格:
<form novalidate class="form-group" ng-hide="tab==1">
Reviews Min: <input type="number" ng-init="revNum=0" class="form-control" min="0" step="10" ng-model="revNum" />
Min Price: <input type="number" ng-init="minNum=0" class="form-control" min="0" step="1000" ng-model="minNum" />
Max Price: <input type="number" ng-init="maxNum=0" class="form-control" min="0" step="1000" ng-model="maxNum" />
<button class="btn btn-primary" ng-click="updateNumArray(revNum, minNum, maxNum)">Filter</button>
</form>
这是我的style.css:
input {
width: 100px;
}
这是我在浏览器中得到的:
我应该改变什么让它看起来像这样:
最佳答案
这里有几个选项..
http://www.bootply.com/cFtRhRycYE
一个使用 col-* 创建单行输入，但每个输入之间有通常的间距。如果你想让它以更少的间距内联，你可以做类似的事情..
<form novalidate="" class="form-inline" ng-hide="tab==1">
<div class="form-group">Reviews Min:<br><input type="number" ng-init="revNum=0" class="form-control" min="0" step="10" ng-model="revNum"> </div>
<div class="form-group">Min Price:<br><input type="number" ng-init="minNum=0" class="form-control" min="0" step="1000" ng-model="minNum"> </div>
<div class="form-group">Max Price:<br><input type="number" ng-init="maxNum=0" class="form-control" min="0" step="1000" ng-model="maxNum"> </div>
<div class="form-group"><br><button class="btn btn-primary" ng-click="updateNumArray(revNum, minNum, maxNum)">Filter</button> </div>
</form>
关于html - 将输入字段的顺序从垂直更改为水平？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25785985/