CSSで長方形の画像を円で切り抜く - not good but great

デモ 画像を円に切り抜く 画像が正方形の場合 img{ border-radius:50%; } 素直にborder-radiusで画像の50%の大きさをしてすればいい。 img{ width:100px; height:100px; border-radius:300px; } pxで指定するのなら、幅よりも大きめの値を設定すればいい。 ・参考 border-radius－CSS3リファレンス 画像が長方形の場合 <img src="http://jsrun.it/assets/x/y/1/B/xy1Bw.jpeg" class="sample" > この画像の大きさは「360×270」だ。 .sample{ border-radius:50%; } 正方形のときと同じように、border-radiusを指定すると楕円形になってしまう。 background-imageを使う <div