今回の記事では要素の角を丸くしたい時に使うやり方を紹介いたします。

角を丸くしたり、正円にすることも可能です。

やり方

border-radius: 〇〇px;と指定するだけです。

このように普通の四角形があるとします。

この四角形にborder-radius: 50px;を指定します。

すると

このように角が丸くなって表示されます。

続いて正円にしたい時のやり方を紹介します。

border-radius: 50%;と指定します。

すると・・・

このように正円にすることができます。