Css 引导表单输入对齐

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

我想用bootstrap制作一个响应表单

以下是我目前的情况:

产品 装置 管理产品 轮廓 123 管理配置文件 从…起 到 负载
您可以像这样组合最后一个表单组

<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屏幕上太宽,因此您可能仍然希望将它们堆叠到垂直列中