引导自动调整根据屏幕大小

Question

我创建了使用引导3.网页设计界面如果在大屏幕尺寸显示，但它看起来像这样：

，但如果在小屏幕中显示它大小，它看起来像这样：

我有问题时，它会在小屏幕尺寸进行显示。我在 Bootply中所做的脚本在小尺寸上不兼容。

Answer 1

您需要将label标签与input标签放在同一列内。

DEMO

<div class="row"> 
    <div class="col-md-3"> 
    <label>Label1</label> 
    <input type="text" class="form-control" value="text1"> 
    </div> 
    <div class="col-md-3"> 
    <label>Label2</label> 
    <input type="text" class="form-control" value="text2"> 
    </div> 
    <div class="col-md-3"> 
    <label>Label3</label> 
    <input type="text" class="form-control" value="text3"> 
    </div> 
    <div class="col-md-3"> 
    <label>Label4</label> 
    <input type="text" class="form-control" value="text4"> 
    </div> 
</div>