Bootstrap 3按钮之间的空间

Question

如果我连续放几个Bootstrap 3按钮:

    <button class="btn btn-default">Button 1</button>
    <button class="btn btn-default">Button 2</button>
    <button class="btn btn-default">Button 3</button>

它们之间有一个小空间.它来自哪里以及如何在不使用浮动的情况下将其移除？根据Firebug和Chrome Inspector,按钮没有应用任何边距.

Answer 1

按钮之间的换行符实际上会占用空间.注意:

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"/>

<button class="btn btn-default">Button 1</button><button class="btn btn-default">Button 2</button><button class="btn btn-default">Button 3</button>

还有就是,如果你想在视觉上进行分组的按钮,你可以使用一个按键组规则:http://getbootstrap.com/components/#btn-groups

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"/>
<div class="btn-group" role="group" aria-label="...">
  <button type="button" class="btn btn-default">Left</button>
  <button type="button" class="btn btn-default">Middle</button>
  <button type="button" class="btn btn-default">Right</button>
</div>