我想使用 <select>字段作为 Bootstrap3 的输入组插件,有点像这样

 ------------------------------------- 
|   select v   |   input text field   | 
 ------------------------------------- 

所以我假设使用 .input-group 来实现这一点, .input-group-addon , 和 .form-control类。

<div class="input-group"> 
    <select class="input-group-addon" id="protocol"> 
        <option>http://</option> 
        <option>https://</option> 
    </select> 
    <input type="text" class="form-control" id="domain" aria-describedby="protocol"> 
</div> 

( See bootply example )

但是 .input-group-addon类似乎不适用于 <select>项目。它看起来像这样:

我该如何解决才能正确对齐它?

请您参考如下方法:

你只需要包装你的 <select>通过 <div>与类 .input-group-addon像这样

<div class="input-group"> 
  <div class="input-group-addon"> 
    <select class="" id="protocol"> 
      <option>http://</option> 
      <option>https://</option> 
    </select> 
  </div> 
  <input class="form-control" id="domain" aria-describedby="protocol" type="text"> 
</div> 

Example


评论关闭
IT序号网

微信公众号号:IT虾米 (左侧二维码扫一扫)欢迎添加!