角丸ボックス

まとめて指定

UHYO 
.radius1{
	border-radius: 10px;
	/*--↓Safari,Google Chrome--*/
	-webkit-border-radius: 10px;
	/*--↓Firefox--*/
	-moz-border-radius: 10px;
	}

個別に指定　その１

UHYO 
.radius2{
	border-radius: 20px 5px 20px 5px;
	/*--↓Safari,Google Chrome--*/
	-webkit-border-radius: 20px 5px 20px 5px;
	/*--↓Firefox--*/
	-moz-border-radius: 20px 5px 20px 5px;
	}

※この表記はSafariだとダメっぽい

個別に指定　その２

UHYO 
.radius3{
	border-top-left-radius: 30px;
	border-top-right-radius: 10px;
	border-bottom-right-radius: 40px;
	border-bottom-left-radius: 20px;

	/*--↓Safari,Google Chrome--*/
	-webkit-border-top-left-radius: 30px;
	-webkit-border-top-right-radius: 10px;
	-webkit-border-bottom-right-radius: 40px;
	-webkit-border-bottom-left-radius: 20px;

	/*--↓Firefox--*/
	-moz-border-radius-topleft: 30px;
	-moz-border-radius-topright: 10px;
	-moz-border-radius-bottomright: 40px;
	-moz-border-radius-bottomleft: 20px;
	}

各角を細かく指定　その１

UHYO 
.radius4{
	border-radius: 30px 30px 30px 30px/10px 10px 10px 10px;
	/*--↓Safari,Google Chrome--*/
	-webkit-border-radius: 30px 30px 30px 30px/10px 10px 10px 10px;
	/*--↓Firefox--*/
	-moz-border-radius: 30px 30px 30px 30px/10px 10px 10px 10px;
	}

※この表記はSafariだとダメっぽい

各角を細かく指定　その２

UHYO 
.radius5{
	border-top-left-radius: 30px 10px;
	border-top-right-radius: 30px 10px;
	border-bottom-right-radius: 30px 10px;
	border-bottom-left-radius: 30px 10px;

	/*--↓Safari,Google Chrome--*/
	-webkit-border-top-left-radius: 30px 10px;
	-webkit-border-top-right-radius: 30px 10px;
	-webkit-border-bottom-right-radius: 30px 10px;
	-webkit-border-bottom-left-radius: 30px 10px;

	/*--↓Firefox--*/
	-moz-border-radius-topleft: 30px 10px;
	-moz-border-radius-topright: 30px 10px;
	-moz-border-radius-bottomright: 30px 10px;
	-moz-border-radius-bottomleft: 30px 10px;
	}