与标签和下拉沿自举横向排列

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>