0

Twitter の Bootstrap 流動レイアウトを使用しています。これは私のコードのスニペットです

<div class="hero-unit" style="background-image:url('images/ball on sand.JPG'); background-size:100%;">
  <h1>Pelican Volleyball</h1>
  <p>The northshore's premiere outdoor volleyball organization</p>
  <p><a href="index.php?p=about" class="btn btn-primary btn-large">Learn more &raquo;</a></p>
</div>

ウィンドウを狭くしすぎると、「砂の上のボール」というイメージが繰り返されます。ヒーロー ユニットの div に完全に収まるように画像の高さを伸ばしたいだけです。どうすればいいですか？

4

2 に答える 2

2

試してみbackground-repeat: no-repeatてbackground-size: cover

于 2013-04-28T03:59:44.803 に答える
0

あなたが試すことができますbackground-size:cover

MDN から

カバー

このキーワードは、背景画像の両方の寸法が対応する背景配置領域の寸法以上であることを確認しながら、背景画像をできるだけ小さくスケーリングする必要があることを指定します。

于 2013-04-28T03:59:00.647 に答える