與標籤和下拉沿自舉橫向排列

Question

Example of my output

我的設計頁面應該包含標籤，下拉列表和自動搜索文本框和一個按鈕控制。 我想把整個事情在Horizantal行，但它不工作正常plz幫助..

Answer 1

很難確切知道怎麼回事沒有一些示例代碼或更多的信息，你已經嘗試過，你是什麼正在期待以及它出錯的地方，但是一般情況下，如果你想在一行中有多個元素，你需要用col風格將它們放入div中。正確的col風格取決於col應該佔用多少可用空間。在引導程序中，行被12列分隔，所以如果你想在行中有一個元素，列div應該包含col-md-12的樣式。列類的基本命名約定如下; col的後綴連字符的前綴，然後是樣式應用於的顯示大小（md表示中等，sm表示小，xs表示特別小），然後是另一個連字符，其中填充了總列數div將佔據。這在bootstraps的官方文檔中有很好的解釋，所以可能會在那邊上頭做一些快速閱讀（例如https://getbootstrap.com/examples/grid/）

例如，

<div class="row"> 
    <div class="col-md-2"> 
     <h4>Example Label</h4> 
    </div> 
    <div class="col-md-4"> 
     <div class="dropdown"> 
      <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Dropdown Example 
      <span class="caret"></span></button> 
      <ul class="dropdown-menu"> 
       <li><a href="#">HTML</a></li> 
       <li><a href="#">CSS</a></li> 
       <li><a href="#">JavaScript</a></li> 
      </ul> 
     </div> 
    </div> 
    <div class="col-md-4"> 
     <input type="text" class="form-control"> 
    </div> 
    <div class="col-md-2"> 
     <button type="submit" class="btn btn-default">Submit</button> 
    </div> 
</div> 

Answer 2

這就是我努力

 <form class ="form-inline" role="form"> 
      <div class ="form-group"> 
       <label for="Device">Device Manager</label> 
      </div> 
      <div class="form-group"> 
       <asp:DropDownList ID="ddlGroup" runat="server" CssClass="form-control input-sm" AutoPostBack="true" AppendDataBoundItems="true" > 
        <asp:ListItem Text="All" Value="0"></asp:ListItem> 
       </asp:DropDownList> 
      </div> 

      <label class="sr-only" for="inlineFormInputGroup">AutoSearch</label> 
      <div class="input-group mb-2 mr-sm-2 mb-sm-0"> 
       <input type="text" class="form-control" id="inlineFormInputGroup" placeholder="Auto Search"/> 
       </div> 
      <button type="submit" class="btn-btn-primary">Search</button> 

     </form>