4

私はzurbを使用しており、1行4列で、これら4列の中に4つの画像があります。画像はすべて同じサイズではないため、画像を100％鮮明にする前に、それぞれに幅と高さを指定する必要があります。

どのクラスを使用する必要があり、どのようにすれば、ブラウザウィンドウのサイズを小さくしているときに画像がレスポンシブ（比率）になり、それに伴ってレスポンシブな列のサイズが大きくなるのでしょうか。

これは私のコードです：

<div class="row">
   <div class="three columns">
      <img src="something.jpg" style="width:220px; height:200px;" />
   </div>
   <div class="three columns">
      <img src="something.jpg" style="width:223px; height:190px;" />
   </div>
   <div class="three columns">
      <img src="something.jpg" style="width:210px; height:150px;" />
   </div>
   <div class="three columns">
      <img src="something.jpg" style="width:210px; height:195px;" />
   </div>
</div>

私はインラインCSSを使用していません。これは、幅と高さの単なる例です。

ありがとうございました。

4

1 に答える 1

3

私はどういうわけかこの部分を.css内でコメントしました：

/* line 45, ../../../../../../../../Library/Ruby/Gems/1.8/gems/zurb-foundation-3.0.4/stylesheets/foundation/grid.scss */
img, object, embed {
  max-width: 100%;
  height: auto;
}

これで私の画像は反応します。

于 2013-01-23T13:07:03.550 に答える