html - 2 列布局，带有粘性页眉和页脚

Question

我想在 不使用框架的情况下创建这个http://www.quackit.com/html/templates/frames/frames_example_5.html 。我希望能够在左侧菜单 div 上设置右边框，但在我找到的示例中，左侧菜单 div 没有从页眉延伸到页脚。其他示例使用重复的 .jpg 为左侧菜单 div 绘制右边框。这应该是一件容易的事，不是吗？请帮忙...

Answer 1

你应该试试CSS layout generator。http://csslayoutgenerator.com/

Answer 2

你为什么使用框架？您还可以使用 css Float: right/left 和 div。

你也可以用 css 制作一个粘性页脚，它类似于：

CSS

.sticky_footer 
{
    width:                              760px;
    border-top:                         1px solid #BEC2C8;
    position:                           fixed;
    bottom:                             0px;
    right:                              0px;
    left:                               0px;
    padding:                            20px 0px 10px;
    background-color:                   whitesmoke;
    background-image:                   url('/img/bg_footer.png');
    background-repeat:                  repeat-x;
    background-position:                top;
}

页（页脚）

<div id="footer">
    <div class="sticky_footer">
        <p class="text-info" style="color: #0088cc !important; text-align: center;">
            <small> copyright ...</small>
        </p>
    </div>
</div>