ChromeでSVGが表示されなかったときのこと

Chromeのみの現象だったが、不思議なことにCSSで背景などに使っているSVGは表示されて、imgタグでは表示されない。
.htaccessだったりで通常の対応もしてみたが効果がなかった。

それで

<object type="image/svg+xml" data="logomark.svg" width="256" height="256"></object>

のようにしてみるとあら不思議。表示されたし、なぜかそれまで表示されてなかった同じSVGも表示された。
ということでobjectタグを外してみると今度は表示がされるようになった。
キャッシュとかなにかあるんだろうか。よくわからないがそんなこともあるというお話。

——-
2017.10.5に追記
Photoshopから書き出したSVGに見られる現象で、Photoshop上で作成したシェイプなら問題無いが、持ち込んだスマートオブジェクトを書き出したものがChromeでは見えなかった。
なのでIllustratorでインラインスタイルで書き出すと大丈夫だと判明。

Category: memo, web

Date posted:2017-10-03

コメントする

Posting your comment...

Subscribe to these comments via email