Border-Radius CSS3 v1.0 </doc>

border-radius

border-radius: border-top-left-radius | border-top-right-radius | border-bottom-left-radius | border-bottom-right-radius;

border-radius: 0px 0px 0px 0px / 0px 0px 0px 0px
border-radius: 0px 0px 0px / 0px 0px 0px
border-radius: 0px 0px / 0px 0px
border-radius: 0px / 0px
border-radius: 0px 0px 0px 0px
border-radius: 0px 0px 0px
border-radius: 0px 0px
border-radius: 0px
X축 / Y축
top left / top right / bottom right / bottom left

Sample01

.radius01 {border-radius: 0px;}
.radius02 {border-radius: 10px;}
.radius03 {border-radius: 20px;}
.radius04 {border-radius: 30px;}
.radius05 {border-radius: 40px;}
.radius06 {border-radius: 50px;}
.radius07 {border-radius: 60px;}
.radius08 {border-radius: 70px;}
.radius09 {border-radius: 80px;}
.radius10 {border-radius: 90px;}

Sample02

.radius11 {border-radius: 0px 0px;}
.radius12 {border-radius: 15px 0px;}
.radius13 {border-radius: 30px 0px;}
.radius14 {border-radius: 45px 0px;}
.radius15 {border-radius: 60px 0px;}
.radius16 {border-radius: 75px 0px;}
.radius17 {border-radius: 90px 0px;}
.radius18 {border-radius: 105px 0px;}
.radius19 {border-radius: 130px 0px;}
.radius20 {border-radius: 145px 0px;}
.radius20.active {
    animation-name: radius20;
    animation-duration: 4s;
    animation-iteration-count: 100;
}
@keyframes radius20 {
    0% {border-radius: 0px 0px;}
    10% {border-radius: 150px 150px;}
    20% {border-radius: 150px 0px;}
    50% {border-radius: 0px 0px;}
    65% {border-radius: 150px 150px;}
    85% {border-radius: 0px 150px;}
    100% {border-radius: 0px 0px;}
}

Sample03

.radius21 {border-radius: 0px / 50px;}
.radius22 {border-radius: 15px / 50px;}
.radius23 {border-radius: 35px / 50px;}
.radius24 {border-radius: 50px / 50px;}
.radius25 {border-radius: 65px / 50px;}
.radius26 {border-radius: 80px / 50px;}
.radius27 {border-radius: 95px / 50px;}
.radius28 {border-radius: 105px / 50px;}
.radius29 {border-radius: 120px / 50px;}
.radius30 {border-radius: 135px / 50px;}

Sample04

.radius31 {border-radius: 0 10px 10px;}
.radius32 {border-radius: 0 30px 30pxx;}
.radius33 {border-radius: 0 50px 50px;}
.radius34 {border-radius: 0 70px 70px;}
.radius35 {border-radius: 0 90px 90px;}
.radius36 {border-radius: 10px 10px 0px;}
.radius37 {border-radius: 30px 30px 0px;}
.radius38 {border-radius: 50px 50px 0px;}
.radius39 {border-radius: 70px 70px 0px;}
.radius40 {border-radius: 90px 90px 0px;}

Sample05

.radius31 {border-radius: 0 10px 10px;}
.radius32 {border-radius: 0 30px 30pxx;}
.radius33 {border-radius: 0 50px 50px;}
.radius34 {border-radius: 0 70px 70px;}
.radius35 {border-radius: 0 90px 90px;}
.radius36 {border-radius: 10px 10px 0px;}
.radius37 {border-radius: 30px 30px 0px;}
.radius38 {border-radius: 50px 50px 0px;}
.radius39 {border-radius: 70px 70px 0px;}
.radius40 {border-radius: 90px 90px 0px;}

Sample06