การกำหนดรัศมีของ element html ด้วย css (less)

less

/*  
less
*/
.round-box (@topRight : 5px, @bottomRight : 5px, @bottomLeft : 5px, @topLeft : 5px){
    /*chrome*/
    -webkit-border-top-right-radius: @topRight;
    -webkit-border-top-left-radius: @topLeft;
    -webkit-border-bottom-right-radius: @bottomRight;
    -webkit-border-bottom-left-radius: @bottomLeft;

    /*Firefox*/
    -moz-border-radius-topright: @topRight;
    -moz-border-radius-topleft: @topLeft;
    -moz-border-radius-bottomright: @bottomRight;
    -moz-border-radius-bottomleft: @bottomLeft;

    /*IE*/
    border-top-right-radius: @topRight;
    border-top-left-radius: @topLeft;
    border-bottom-right-radius: @bottomRight;
    border-bottom-left-radius: @bottomLeft;
}

การเรียกใช้งาน

.round-box (15px, 10px, 0px, 5px);
.round-box (3px, 3px, 3px, 3px);
.round-box; /* 5px for all coner by defult */

div.topic{
    .round-box (3px, 3px, 3px, 3px);
    color : red;
    background-color : yellow;
}