本文介绍了Bootstrap 3按钮之间的空间的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧! 问题描述 29岁程序员,3月因学历无情被辞! 如果我连续放置几个Bootstrap 3按钮: < button class = btn btn-default> ;按钮1< / button> < button class = btn btn-default>按钮2< / button> < button class = btn btn-default>按钮3< / button> 它们之间有很小的空间。它来自哪里,如何在不使用float的情况下将其删除?根据Firebug和Chrome Inspector的说法,按钮没有任何保证金。解决方案按钮之间的换行符实际上会导致空间。观察: < link href = // maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css rel = stylesheet />< button class = btn btn-default>按钮1< / button>< button class = btn btn-default>按钮2< / button><按钮class = btn btn-default>按钮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-gr oup role = group aria-label = ...> < button type = button class = btn btn-default>左< / button> < button type = button class = btn btn-default>中< / button> < button type = button class = btn btn-default>右< / button>< / div> If I put several Bootstrap 3 buttons in a row: <button class="btn btn-default">Button 1</button> <button class="btn btn-default">Button 2</button> <button class="btn btn-default">Button 3</button>there is a small space between them. Where does it come from and how to remove it without using float? According to the Firebug and Chrome Inspector the buttons haven't any margin applied to them. 解决方案 The newline between the buttons actually causes the space. Observe:<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>There is a button-group rule you can use if you want the buttons visually grouped: 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> 这篇关于Bootstrap 3按钮之间的空间的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持! 上岸,阿里云! 08-31 03:53