Html 如何在引导中的一行上显示输入按钮？

我做了一个小的引导面板，在面板底部有3个引导按钮。我想做的是让所有的按钮都在一条线上，并且有一个小的间隙，而不是捆在一起。这是我现在拥有的，这是它正在做的：

。最近的
{
边缘顶部：50px；
右边距：500px；
}
.最近的投入
{
浮动：左；
}

最近的
-科罗拉多州奥罗拉：废话废话

您需要将列宽加宽。由于您使用的是

col-lg-3

class，最后一个按钮将换行到下一行。尝试将其更改为较大的列（即

col-lg-6

）。要回答问题的第二部分，如果需要在按钮之间留出一些空间，可以添加CSS规则，如

.btn{margin:0 5px；}

。

也可以不使用

float

属性来实现。使用

display:inline block

而不是

float

或者在

.row

或

.container

中使用3个多除法（.col-sm、.col-md、.col-lg），您可以尝试此代码

<div class="recent">
                <div class="container">
                     <div class="row">

                        <div class="panel panel-primary">
                            <div class="panel-heading"><center><span class="label label-danger">Recent</span></center></div>
                            <div class="panel-body">
                                <p>- Aurora, Colorado : Blah Blah Blah</p>
                                <div class="col-lg-2"><input type="button" value="View all" onClick="#" class="btn btn-primary"></div>
                                <div class="col-lg-2"><input type="button" value="Last 24 hours" onClick="#" class="btn btn-danger"></div>
                                <div class="col-lg-2"><input type="button" value="Last 48 hours" onClick="#" class="btn btn-warning"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

最近的
-科罗拉多州奥罗拉：废话废话

这里有几点

你为什么给最近的课留500分？这将在响应方面产生问题。即使您只针对桌面屏幕，这也不是好的做法。500页边距强制减少最近的宽度

如果您使用的是col-lg-3，则可以将col-lg-3用于大于1200像素宽的大屏幕。。对于小屏幕，有col-md-3、col-sm-3和col-xs-3

给按钮留出一点空白，以便它们有一点空间


。最近的
{
边缘顶部：50px；
}
.最近的投入
{
浮动：左；
}
对{
右边距：5px；
}

最近的
-科罗拉多州奥罗拉：废话废话

另一个问题。col-lg-3和col-sm-3等有什么区别？我试着和lg、md和sm混在一起，但它们的大小都一样。
xs
根本不会崩溃。其余的（
sm
，
md
，
lg
，
xl
）都指向不同的断点（例如，当多列折叠成多行时。因此，如果您想在所有屏幕（最大的屏幕除外）上将列折叠成行，请使用
xl
。如果您想在所有屏幕（小屏幕除外）上使列正常，请使用
sm
。getbootstrap.com将是您的最佳资源。@DonaldCox-您可以找到示例在他们的网格系统文档中使用这些类的情况：我正在使用500px的边距来达到我想要的目的，我现在真的不知道其他的方法。取决于你的结构。你可以给出特定的widh和显示内联块。第二个选项是给最近的类留下浮动。如果你可以共享模型，我可以给你这是html基本结构的基本概念。