問題タブ [picture-element]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
414 参照

html - 画像要素の長所と短所は何ですか?

pictureHTML5要素の長所と短所は何ですか?

特に、ブラウザがすべての画像をダウンロードするかどうか? それとも、ブラウザはメディアクエリに一致する画像のみをダウンロードしますか?

0 投票する
2 に答える
793 参照

html - Picture 要素: すべての scrset 属性にフル パスを設定する必要がありますか?

レスポンシブ画像、ユースケース、新しい HTML5picture要素については、この記事で詳しく説明しています。

更新:より具体的には、レスポンシブ画像、さまざまなデバイス用にサイズ変更された画像を意味します。画像の重量が少ないため、サイトの読み込みが速くなります。最大72% の軽量化

示されている例は単なるファイル名 (パスなし) ですが、実際には次のようにより詳細になります。

毎回フルパスを設定するのは不自然に思えます。

私はこれを好みます:

ところで、可読性とプログラミング ロジックについては、ファイル名ではなくパス内の応答性の高いものを好みます。あなたはこれを行うことができます

特定の幅のサポートを中止する場合は、ディレクトリを削除してください。

しかし、主な問題は、1 つの画像に対して非常に多くのコードが必要なことです。

したがって、それを制限するには(JSソリューションなしで):

pathsrc属性やスコープ付き基本要素などを設定できますか?

0 投票する
2 に答える
269 参照

html - HTML5 srcset、サイズ、アート ディレクション

私が知る限り、属性srcsetsizes属性は、デバイスのサイズと解像度に合わせて適切にスケーリングされた画像を適用することに重点を置いています。

これらの属性を使用して、画面サイズに基づいて別の画像を選択する機能はないようです。

これは状況の正しい理解ですか?pictureこれは、要素がこのタスクで広くサポートされるまで待たなければならないということですか?