HTMLの画像サイズ変更問題の解決策-htmlチュートリアル-php.cn

HTMLの画像サイズ変更問題の解決策

黄舟

リリース： 2017-07-26 13:33:12

オリジナル

4127 人が閲覧しました

サードパーティのインターフェースから写真を取得しました。ページに画像を埋め込んだところ、画像が大きすぎることがわかりました。 div のサイズを直接変更しても機能しません。画像は同じサイズのままです。画像の表示サイズを調整する方法はありますか？

画像は動的に取得されるため、ページを更新すると新しい画像が取得されます。したがって、画像を再トリミングしても問題は解決されません。

HTMLのソースコードは次のとおりです

<div class="row">
            <div class="col-md-4">
                <div class="panel panel-primary">
                    <img  src="http://abc.jpeg"></img>
                </div>
            </div>
            <div class="col-md-4">
                <div class="panel panel-primary">
                    <img src="http://abc.jpeg"></img>
                </div>
            </div>
            <div class="col-md-4">
                <div class="panel panel-primary">
                    <img src="http://abc.jpeg"></img>
                </div>
            </div>
        </div>

ログイン後にコピー

それでも問題を解決できない場合は、ブートストラップの画像自動応答クラスを試すことができます

<img class="img-responsive" src="http://abc.jpeg" />

ログイン後にコピー

。上記のメソッドを入力して幅と高さを追加して制限するだけです。 it

<img style="width=100px; height=100px" src="http://abc.jpeg" />

ログイン後にコピー

css を書きます

 .panel img{ width:你期望的宽; height:你期望的高}

ログイン後にコピー

div のサイズではなく、img タグのサイズを調整する必要があります。

他人の写真を取得している場合、写真の長さと幅が確認されていないことを意味し、サイズも不明です。imgを使用して長さと幅を制限すると、問題が発生します。

最善の方法は、

rree しながら .panel の長さと幅を調整することです

以上がHTMLの画像サイズ変更問題の解決策の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。