web-dev-qa-db-ja.com

親DIVを介して画像サイズを変更する

私はそうしようとしましたが、サイズは変わりませんでした：

<div style="height:42px;width:42px">
   <img src="http://someimage.jpg">
</div>

サイズを変更するもの（img要素自体を編集/タッチすることはできません）。

前もって感謝します。

htmlimage-size
16
funerr

「画像にアクセスできません」という意味がわかりませんが、親divにアクセスできる場合は、次のことができます。

もみはあなたのdivにIDまたはクラスを与えます：

<div class="parent">
   <img src="http://someimage.jpg">
</div>

これをcssに追加するより：

.parent {
   width: 42px; /* I took the width from your post and placed it in css */
   height: 42px;
}

/* This will style any <img> element in .parent div */
.parent img {
   height: 100%;
   width: 100%;
}
29
Ilja

適用100%画像の幅と高さ：

<div style="height:42px;width:42px">
  <img src="http://someimage.jpg" style="width:100%; height:100%">
</div>

これにより、親と同じサイズになります。

7
Sarfraz

画像が指定したdivサイズより小さい場合、実際に100％を使用しても画像は大きくなりません。すべての画像がスペースを埋めるように、寸法、高さ、幅のいずれかを設定する必要があります。私の経験では、各行が同じサイズになるように高さを設定してから、すべてのアイテムが次の行に適切に折り返されるようにする方が良いでしょう。これにより、fotolia.com（ストックイメージWebサイト）のような出力が生成されます。

cSSを使用：

parent {
   width: 42px; /* I took the width from your post and placed it in css */
   height: 42px;
}

/* This will style any <img> element in .parent div */
.parent img {
   height: 42px;
}

なし：

<div style="height:42px;width:42px">
    <img style="height:42px" src="http://someimage.jpg">
</div>
0
JJ_Coder4Hire

あなたのもの：

  <div style="height:42px;width:42px">
  <img src="http://someimage.jpg">

このコードを使用しても大丈夫ですか？

  <div class= "box">
  <img src= "http://someimage.jpg" class= "img">
  </div>

  <style type="text/css">
  .box{width: 42; height: 42;}
  .img{width: 20; height:20;}
  </style>

遅れてはいますが：3これを読んでいる他の人のために、私がコードを書いた方法が良くなかったかどうか知らせてください。この種の言語では新しい。そして、私はまだもっと学びたいです。

0
Debbie