html - ヘッダーとフッターが固定された 2 列のレイアウト

Question

フレームを使用せずにこのhttp://www.quackit.com/html/templates/frames/frames_example_5.htmlを作成したいと思います。左のメニュー div に右の境界線を設定できるようにしたいのですが、見つけた例では、左のメニュー div がヘッダーからフッターまで拡張されていません。他の例では、繰り返し .jpg を使用して、左側のメニュー div の右側の境界線を描画しています。これは簡単な作業ですよね？助けてください...

Answer 1

なぜフレームを使用するのですか?? 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>

Answer 2

試してみてくださいCSS layout generator。http://csslayoutgenerator.com/