4つの角ごとに角丸の半径を指定する

border-radiusプロパティでは、4つの角それぞれに角丸の半径を指定することができます。その場合、次のように左上の角から順に時計回りで値を指定していきいます。

　
border-radius: 左上 右上 右下 左下

たとえば、記事のヘッダー部分で、枠の角ごとに角丸の半径を変えて表示すると右のようになります。ここでは次のように半径を指定しています。

article header
	{border: solid 1px #aaaaaa;
	margin: 20px 0 10px;
	padding: 18px;
	border-radius: 0 30px 60px 90px}

角ごとに半径を変えて表示したもの