ファンデーションを試しています。リンク: http://foundation.zurb.com/docs/index.php
私は非常に単純な Div を持っています:
<div style="background:url(gymBasketballHoops.jpg);height:100%;"> </div>
高さを 190 ピクセルに設定すると、ブラウザーのサイズに関係なく 190 と表示されますが、高さを 100% に設定すると、50 ピクセルの画像しか表示されません。私は現在のサイトで背景画像になるものをたくさん使用していますが、それらの高さにも対応したいと思っています。どうすればこれを達成できますか?
<div style="background:url(gymBasketballHoops.jpg);height:100%;"> </div>
高さを 190 ピクセルに設定すると、ブラウザーのサイズに関係なく 190 と表示されますが、高さを 100% に設定すると、50 ピクセルの画像しか表示されません。
HTML/CSS の残りの部分を確認せずに、次のもの以外はお勧めできません...
190px固定サイズで、ブラウザや解像度に関係なく、高さは 190 ピクセルになります。
100%div内容ではなく、外側のコンテナに対するサイズです。外側のコンテナーの高さが 500 ピクセルの場合、<div>その 100% になります。
は<div>を除いて空であるため 、サイズを設定する必要があります。そうしないと、 を囲むのに十分な大きさ しかないため、サイズを指定しないと、コンテンツのサイズにのみ反応します。
したがって、外側のコンテナーに基づいてパーセンテージを設定したり、固定の高さを設定したり、それを省略してコンテンツに高さを指定させたりすることができます。