【CSS】CSSでマスク、クリッピングをしてみよう | unitopi - ユニトピ -こんにちは。 今日はCSSに関するポストです。 まず、CSSで以下のようなプロパティを使ったこと有りますか？ clip clipプロパティは、ボックスを切り抜き表示（クリッピング）する際に使用します。 引用：clip－スタイルシートリファレンス .element { clip: rect(10px, 20px, 30px, 40px); } このような形で、通常のCSS指定どおり上から時計回りに指定します。 これはCSS2でも使えました。 ただ、通常はoverflow:hidden;にして、位置を調整するのが一般的だったように思えます。 clip-path 本日の目玉はこちら。これまでのclipでは短形で、かつ絶対的に配置されている場合のみ有効でした。 どうなるか見てみましょう。 img.sample-img{ width:300px; clip-path: circle(100px at
