html - CSS 3 列布局，高度灵活的侧边栏，SEO 代码顺序 : CONTENT-LEFT-RIGHT

Question

我想获得一些关于 CSS 的建议。我的目标是:

1. 3 列布局 - 左侧边栏、主要内容、右侧边栏
2. 侧边栏具有基于内容列高度的灵活高度。
3. 出于 SEO 目的，我需要包含要按此顺序调用的内容的 PHP 文件。
   1. 主要内容文件
   2. 左侧边栏文件
   3. 右侧边栏文件

所以 div 必须这样排序:

<div id="columns-container">
        <div id="content-bar">              
             <!-- PHP include of the content (middle bar) -->                                       
        </div>
        <div id="left-sidebar">             
            <!-- PHP include of the leftbar navigation -->                                          
        </div> 
        <div id="right-sidebar">            
            <!-- PHP include of the rightbar with ads and stuff -->                                     
        </div>          
</div>

如果我按“左栏 - 内容 - 右栏”的顺序调用文件，即使对我来说也很容易。但这对我来说是一项艰巨的任务。

到目前为止，我已经能够创建具有最小高度的侧边栏，但我不知道如何扩展它们。

我迷失了 CSS，我认为我的解决方案是错误的，所以如果有人帮助我从头开始构建它并做得更好，我将不胜感激。

Answer 1

您可以使用最流行的“即用型”布局之一:Holy Grail .它拥有您想要的一切。