Css 引导表单输入对齐
我想用bootstrap制作一个响应表单 以下是我目前的情况: 产品 装置 管理产品 轮廓 123 管理配置文件 从…起 到 负载Css 引导表单输入对齐,css,twitter-bootstrap,twitter-bootstrap-3,Css,Twitter Bootstrap,Twitter Bootstrap 3,我想用bootstrap制作一个响应表单 以下是我目前的情况: 产品 装置 管理产品 轮廓 123 管理配置文件 从…起 到 负载 您可以像这样组合最后一个表单组 <div class="container-fluid"> <form class="form-horizontal"> <div class="form-group"> <label class="control-label col-md-1
您可以像这样组合最后一个表单组
<div class="container-fluid">
<form class="form-horizontal">
<div class="form-group">
<label class="control-label col-md-1 col-sm-1 col-xs-12">Product
</label>
<div class="col-lg-3 col-md-4 col-sm-9 col-xs-12">
<select class="form-control input-lg">
<option>
Device
</option>
</select>
</div>
<div class="col-md-offset-1 col-sm-offset-1 col-lg-3 col-md-4 col-sm-9 col-xs-12">
<button type="button" class="btn btn-block btn-default btn-lg">Manage product
</button>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-1 col-sm-1 col-xs-12">Profile
</label>
<div class="col-lg-3 col-md-4 col-sm-9 col-xs-12">
<select class="form-control input-lg">
<option>123
</option>
</select>
</div>
<div class="col-md-offset-1 col-sm-offset-1 col-lg-3 col-md-4 col-sm-9 col-xs-12">
<button type="button" class="btn btn-block btn-default btn-lg">Manage profile
</button>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-1 col-sm-1 col-xs-3" for="from">From
</label>
<div class="col-lg-3 col-md-4 col-sm-4 col-xs-9">
<input type="date" data-format="yyyy-MM-dd" class="form-control input-lg" value="2018-01-24">
</div>
<label class="control-label col-md-1 col-sm-1 col-xs-3" for="to">To
</label>
<div class="col-lg-3 col-md-4 col-sm-4 col-xs-9">
<input type="date" data-format="yyyy-MM-dd" class="form-control input-lg" value="2018-01-26">
</div>
</div>
<div class="form-group">
<div class="col-md-offset-1 col-sm-offset-1 col-lg-3 col-md-4 col-sm-9 col-xs-12"></div>
</div>
</form>
</div>
但是,在最后2个日期输入中,它们在xs屏幕上太宽,因此您可能仍然希望将它们堆叠到垂直列中