html - css背景画像で異なるサイズのSVGグラフィックを提供するには?

Question

ブラウザの幅が 768px 未満の場合のメディア クエリを使用してサイトを作成しています。

ブラウザが 768px 未満の場合、通常は 100x100 の SVG 背景画像 (ロゴ) を 80x80 に縮小したいと考えています。

メディア クエリを使用して SVG グラフィックスのサイズを縮小することは可能ですか?

Answer 1

はい、可能です。こことここにいくつかの例があります。

ただし、サイズを縮小する場合は、svg 自体ではなく、CSS によって決定されるサイズについて話している可能性があります (svg は、正しく行われている限り、CSS によって指定された領域に再描画する必要があります)。

Answer 2

ロゴの幅と高さが減少するデバイスに応じて、ロゴ画像に % width を使用します。