【CSS】border-radiusでimgタグを丸くする方法

imgタグを丸くするには、border-radiusプロパティを使用します。

img {
    border-radius: 50%; /* 半径50% */
}

上記のようにborder-radiusに50%という値を指定することで、画像が丸くなります。

また、具体的な半径の値で指定することもできます。

img {
    border-radius: 20px; /* 半径20px */
}

border-radiusは、上下左右それぞれに設定することもできるので、特定の方向を丸くすることも可能です。

img {
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
}

imgタグにborder-radiusプロパティを適用することで、簡単に画像の角を丸くすることができます。