SVGで画像を切り抜く [クリッピングマスク] [IE含め全モダンブラウザに対応] | 東京のホームページ制作 / WEB制作会社 BRISK更新するコンテンツの画像が正方形・長方形以外の形のとき、どうコーディングしようか迷うことがありますね。 ただの円形なら CSS で丸める、背景が単色なら切り抜く部分を透明にした png や svg を画像の上に重ねるなどで対応できますが、どちらも難しい場合は SVG での切り抜きがおすすめです。 ただ、記述の仕方によって、IEで表示されなかったりスマホで拡大・縮小できなかったりと検証が面倒…。 そういったポイントを押さえ、全モダンブラウザで表示できる方法をご紹介します！
![SVGで画像を切り抜く [クリッピングマスク] [IE含め全モダンブラウザに対応] | 東京のホームページ制作 / WEB制作会社 BRISK](https://cdn-ak-scissors.b.st-hatena.com/image/square/63ded0f069640c19a5f9bb36956537ba37ea627c/height=288;version=1;width=512/https%3A%2F%2Fb-risk.jp%2Fwp%2Fwp-content%2Fuploads%2F2018%2F07%2Fsvg-clippath-kv2.png)
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
