1

私のウェブサイト

上記のリンクでは、中間のニュース投稿の画像が大きすぎることがわかります。ニュースの情報はデータベースから取得されるため、特定の画像のみで画像の幅を変更する方法がわかりません。理想的には、幅が 300px を超える画像を 300px に維持したいと考えています。これは私がこれまでに持っているものです:

echo '<img src="media/'.$row['media1'].'" class="floatLeftClear" id="border">';

上記のステートメントに width="300" を追加するのにうんざりしましたが、それによりすべての画像が 300px になり、望ましくありません。300px より大きい画像のみを 300 に縮小したい。

誰かが私を正しい方向に向けることができますか!

4

3 に答える 3

3

サーバー上で画像のサイズを物理的に変更したくない場合 (これが理想的なソリューションです)、max-widthCSS を介してプロパティを設定できます。

img {
  max-width:300px;
}

プロパティは IE6 以下ではサポートされていないことに注意してください。

于 2011-04-09T12:36:34.283 に答える
1

このコードは、画像のサイズ変更に役立ちます。高さと幅のサイズ変更は、最大幅に依存します

function fixImgs(whichId, maxW) {
  var pix=document.getElementById(whichId).getElementsByTagName('img');
  for (i=0; i<pix.length; i++) {
    w=pix[i].width;
    h=pix[i].height;
    if (w > maxW) {
      f=1-((w - maxW) / w);
      pix[i].width=w * f;
      pix[i].height=h * f;
    }
  }
}


fixImgs('photos', 108);  // ('element ID', maximum width)

しかし、画像サイズ（KB）が減らないことが1つあります。お役に立てば幸いです。

于 2011-04-09T12:39:10.650 に答える
0

ニュース画像レイアウト用の特別なルーチンを追加し、その中で max-size を定義し、関連する画像に対してそれを呼び出してみませんか?

于 2011-04-09T12:36:44.487 に答える