面倒くさがりな自分、ちょっと調べて実施しました。丸くくり抜くには「border-radius」プロパティ「border-radiusプロパティ」は、基本的にボックスの角を丸くするプロパティ。使い方は簡単で、ブロックレベルでもインラインレベルでも使用可能。}上記、200pxの正方形を例に説明すると。}という風にborder-radius:プロパティを追加。そのあとの20pxは20px×20pxの正方形の弧で角を丸めるという意味。分かりづらいので図で説明すると、って事。黄色い部分の弧(白色)が実際の角の丸みです。パラメータの設定はpx以外にも、em,pt等が使えます。画像の半分の大きさ(半分以上?)で丸く切り抜けるという事。}と丸くくり貫けます。ここで「ちょっと待ってよ!いちいち画像とかボックスのサイズ気にすることすらメンドくさいんだけど?」って方、ごもっとも。幸いな事にそれすらしなくて問題ない方法があります。何と「border-radius:プロパティは%で設定可能!」です。画像のサイズとかを気にしないで「兎に角丸くくり抜きたいんだ!!」って時は、50%と入力するだけ。これで画像だろうがなんだろうが丸く切り抜く事が可能です。この「border-radius:プロパティ」は結構複雑な形にも切り抜けるので色々試すのも面白いです。楕円形にしたり変わった形に切り抜く方法は下記リンクに詳しく載っているのでそちらを参照して下さい。便利なジェネレータ機能も作成しているみたいですし。CSSのborder-radiusは実はすごかった!あまり知られていない機能を使用して、かっこいいレイアウトを作る方法まとめまとめると画像等を丸くくり抜くには「border-radiusプロパティ」を使用。正方形の場合は「何も考えずとも50%とプロパティ設定」で問題なし。ちなみに長方形の場合どうなるか、簡単ですが下記にメモしておきます。