La propriété CSS 3 "Border"

Border-radius

-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;

Où bien...

-moz-border-radius: 100px / 160px;
-webkit-border-radius: 100px / 160px;
border-radius: 100px / 160px;

Où encore...

-moz-border-radius: 160px / 100px;
-webkit-border-radius: 160px / 100px;
border-radius: 160px / 100px;

Un dernier en gérant chaque angles séparément...

-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomright: 20px;
-webkit-border-top-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
border-top-left-radius: 20px;
border-bottom-right-radius: 20px;

Border-[coté]-colors

Dans cet exemple nous avons un dégradé du noir vers le blanc en 8 couleurs, donc une marge de 8 pixel. Il faudra autant de pixel à la marge que de couleurs formant le dégradé.

NOTE : A ce jour seul le moteur Gecko (Mozilla Firefox) est capable d'interpréter ce style.
Google Chrome et IE 9, bientôt ???

Border-[coté]-colors

border: 8px solid #000;
-moz-border-top-colors:#101110 #252525 #414241 #636363 #888987 #acadac #cfcfcf #ebebeb;
-moz-border-left-colors:#101110 #252525 #414241 #636363 #888987 #acadac #cfcfcf #ebebeb;
-moz-border-bottom-colors:#101110 #252525 #414241 #636363 #888987 #acadac #cfcfcf #ebebeb;
-moz-border-right-colors:#101110 #252525 #414241 #636363 #888987 #acadac #cfcfcf #ebebeb;

Border-image

NOTE : Cette fois-ci c'est Safari et Google chrome (Moteur Webkit) qui sont capables d'interpréter ce style.
Firefox (moteur Gecko) ne reconnait pas cette propriétés CSS 3.
Internet Explorer..................... No comment...

3.6+

1.3+

10.5+

Voici à gauche l'image utilisée et à droite en image le rendu recherché visible avec Google Chrome:

Border-image,
visible avec Google Chrome et Safari.

-webkit-border-image: url(images/border.png) 27 27 27 27 round round;