CSSの角丸設定（border-radius）

以前は、画像で表現していた角丸がCSSで実装できるようになりました。

2016年1月現在、ほとんどのブラウザが対応しています。

角丸は、CSSのborder-radiusは使用します。

角丸の設定の仕方

border-radius:~px;

の一行を記載します。

試しに、
border-radius:8px;
を設定します。

次にかなり丸めのborder-radius:45px;
を設定します。

上だけなど、一角（一部分）だけ角丸にする場合

上だけや左下だけなど、一角（一部分）だけ角丸に設定する事ができます。

右上のみ角丸

border-top-right-radius : 17px;

左上のみ角丸

border-top-right-radius : 17px;

右下のみ角丸

border-top-right-radius : 17px;

左下のみ角丸

border-bottom-right-radius : 17px;