1

私のテンプレートは次のとおりです。

ここに画像の説明を入力

.layout{

height:100%;
width: 70%;
position: fixed;

}

.header{

height:20%;
width: 100%;

}

.content{

height:60%;
width: 100%;

}

.footer{

height:20%;
width: 100%;

}

コンテンツのデフォルトの高さは60%で、必要に応じて (高さ/幅) の自動ストレッチを取得するデータでコンテンツが満たされ、ページ全体にスクロールが表示される場合、どうすればよいですか?

私は親 を与えるための解決策を試しましたpostion:relative;が、デフォルトの高さを無視し、コンテンツのデータが小さい場合はコンテンツを最小化し、データが小さい場合はデフォルトの高さを維持したいと考えています。

4

2 に答える 2

2

Motoxer4533 で示されているように、min-height プロパティを使用します: http://jsfiddle.net/uef7v/

于 2011-12-11T12:08:18.353 に答える
1

プロパティで.content高さを設定するだけです：min-height

.content{
   min-height:60%;
}

これにより、最小の高さが.content60% に設定され、コンテンツのデータが 60% 以上を占める場合、自動的に引き伸ばされます。ただし、位置をドロップする必要があります。レイアウトに固定されています。コンテンツが動的な場合は必要ありません。

于 2011-12-11T13:15:47.077 に答える