引導自動調整根據屏幕大小

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>