CSS3 角丸プロパティ border-radius

CSS3では角丸プロパティがあります。
※ IE否対応、デモにはPIE.htcを導入

■ 一括指定

.bradius {
    border-radius: 50px;
}

.bradius {
    border-top-left-radius: 0
    border-top-right-radius: 0
    border-bottom-right-radius: 30px;
    border-bottom-left-radius: 30px;

    /*firefoxは記述が異なるので注意*/
    -moz-border-radius-topleft: 0;
    -moz-border-radius-topright: 0;
    -moz-border-radius-bottomright: 30px;
    -moz-border-radius-bottomleft: 30px;
}

DEMO

Tags: CSS3