コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > htmlチュートリアル > 異なる画面解像度に応じて異なる画像を表示するにはどうすればよいですか? _html/css_WEB-ITnose

異なる画面解像度に応じて異なる画像を表示するにはどうすればよいですか? _html/css_WEB-ITnose

WBOY
リリース： 2016-06-24 11:50:00
オリジナル
2116 人が閲覧しました

画面幅が 1400 未満の場合は、画像 1 を使用します。
それより大きい場合は、画像 2 を使用し、画像の幅を画面の幅に指定します。


ディスカッションに返信 (解決策)

window.screen.width を定義し、それをバックグラウンド出力に渡します

<script> <p class="sougouAnswer"> if(window.screen.width<1400){ <br /> document.write( "< img src='img1.png' style='width:100%' text-align='center'>"); <br> }else{ <br> document.write("<img src='img2.png ' style= 'width:100%' text-align='center'>"); <br> } <br> </script>

関連ラベル：
如何根据不同的屏幕分辨率来显示不同的图片？
ソース：php.cn
前の記事：HTML および CSS_html/css_WEB-ITnose における Web ページのレイアウトの問題 次の記事：同時に 2 つのアクションに値を渡すにはどうすればよいですか? _html/css_WEB-ITnose
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
画面幅に応じて異なるコンテンツを表示する 1 つの要素に対して、画面の幅に基づいて 2 つの異なるテキストがあります。画面幅が400px以下の場合に狭く表示したい。画面幅が400pxを超える場合に大きく表示したい。コードは...
から 2024-04-01 22:53:42
0
1
299
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート