Bootstrap 侧边栏宽度答案

【问题标题】：Bootstrap Sidebar WIdthBootstrap 侧边栏宽度
【发布时间】：2023-03-30 14:08:01
【问题描述】：

我是新手。试图绕过宽度为 300 像素的侧边栏。目前使用 span3 我会得到 270px，使用 span4 我会得到 370px。

有没有办法让我获得 300 像素的侧边栏，如果没有，我将不得不坚持使用 span3。

谢谢。

【问题讨论】：

【解决方案1】：

您应该使用网格。首先参考manual。这是一个简单的布局。假设您使用的是 Bootstrap 3。

<div class="row">
    <div class="col-md-8">Main Contents Here</div>
    <div class="col-md-4">Sidebar Widget Here</div>
</div>

这将创建一个两列布局。

【讨论】：

感谢 aliasm2k。是的，这就是我正在做的事情。但我想知道是否有办法将侧边栏宽度设置为 300 像素，因为 span3 将使其变为 270 像素，而 span4 将使其变为 370。
使用网格单位引导测量。共有12个网格单元可用，您可以根据需要进行划分。如果您需要更宽的内容区域和更小的侧边栏，您可以尝试 10-2 组合而不是示例中的 8-4 组合。
这将使我的侧边栏为 270 像素。我的问题是我怎样才能拥有一个宽度为 300 像素的侧边栏。 <div class="row"> <div class="col-lg-9">Contents Area</div> <div class="col-lg-3">Sidebar</div> </div> 同样，如果我使用 col-lg-8（内容）和 col-lg-4（侧边栏），我将获得 370px 宽度的侧边栏。

【解决方案2】：

您始终可以根据您的特定要求创建两个新的 col-md。

然后将它们添加到所有媒体查询中以获得完整的响应。

【讨论】：