外部 CSS ファイルにインラインで SVG を埋め込む方法

別に style タグやインラインスタイルに書いてもいいけど。 ということで、SVG ってあるじゃないですか。 いわゆるひとつの、Scalable Vector Graphics。 一般的に広く使われている JPEG や PNG のようなラスタイメージとは違ってベクタ形式なので、拡大縮小しても綺麗に表示できるっていうアレですね。 SVG は XML――すなわちテキストで記述されているので、ラスタイメージのように画像自体の縦横に比例してファイルサイズが際限なく大きくなってしまうようなことが起こり難く、ファイルサイズを比較的小さく保ち易いという利点もあります。 ※テキストだけに、http での転送時は gzip 圧縮も利きますし。 綺麗な上にファイルサイズも小さいときては、最近の Web ブラウザは基本的に対応していることもあり、そろそろ積極的に使っていこうと考えている方も多いのではないかと思