0

php include関数を使用して要素を含むdivがあり、その下にフッターがあります。フッターは、スペースを節約するためにページの一番下までスクロールした場合にのみ表示されます。

問題は、コンテンツの高さが小さい場合（300pxなど）、フッターがページの下部に配置されないため、レイアウトが見栄えが悪くなることです。

だから私の質問は、ブラウザウィンドウにスクロールバーが表示されていないとき（コンテンツのdivの高さが小さいことを意味します）にフッターを下部に配置できますか？

4

2 に答える 2

4

スティッキーフッターのように聞こえますが、探しているのは次のとおりです。

HTML:

<div id="wrap">
    <div id="main">content</div>
</div>

<div id="footer">footer</div>​

CSS:

* { margin:0; padding:0; } 

html, body, #wrap { height: 100%; }

body > #wrap {
    height: auto; 
    min-height: 100%;
}

#main { 
    padding-bottom: 40px; /* must be same height as the footer */
}  

#footer { 
    position: relative;
    margin-top: -40px; /* negative value of footer height */
    height: 40px;
    clear:both;
    background: #c00;
}

ここでフィドル。 </p>

これにより、少なくともウィンドウの下部にfooterdiv を配置できます。コンテンツ div が大きくなると、それに応じてフッターが押し下げられます。main

于 2012-10-09T16:12:35.157 に答える
1

サーバー (PHP) がウィンドウの高さを知る方法がないため、これは JavaScript でのみ行うことができます。そうは言っても、それは確かに可能です。コンテンツがブラウザ ウィンドウの高さよりも小さい場合は、たとえば、フッター div にposition:fixedandbottom: 0pxを設定してウィンドウの下部に貼り付けることができます。それ以外の場合は、コンテンツの下部に配置してください。

于 2012-10-09T16:00:14.223 に答える