添加两个侧边栏

Add two sidebars

本文关键字：两个 侧边栏 添加      更新时间：2023-09-26

我想在我当前的网站上添加两个侧边栏，但我很困惑如何做。我是否将其添加到包装器外部？我试图将其添加到包装器中，但如果我这样做，它将保持在顶部。

感谢您的所有帮助，我很感激

小提琴/代码点击这里

enter code here

要左右添加列，我们需要正确编写标记示例：

  <div class="wrapper">
<div class="left-side"> </ div>
<div class="center"> </ div>
<div class="right-side"> </ div>
</ div>

在样式表中指定正确的属性的位置

将

css float:left添加到侧边栏和主要内容以及宽度。浮子将使它们彼此相邻排列。

您可能还想研究像 Boostrap 这样的 CSS 框架，它提供了许多用于布局的预制类以及示例模板。使用Bootstrap，你的html将类似于这样：

<div class="row">
    <div role="aside" id="sidebar1" class="col-md-3"></div>
    <div role="main" id="main" class="col-md-6"></div>
    <div role="aside" id="sidebar2" class="col-md-3"></div>
</div>
相关文章：