CSS3 borders, border-image

Okraje nemusia tvoriť len čiary, ale po novom aj obrázky.

V prípade okrajov použijeme:
border-top-image
border-right-image
border-bottom-image
border-left-image

V prípade rohov použijeme:
border-top-left-image
border-top-right-image
border-bottom-left-imag
border-bottom-right-image

Toto všetko je možne aj jedným príkazom a pomocou jediného obrázku, ktorý vycentrujeme. CSS môže vyzerať nasledovne:

CSS

border-image: url(border.png) 27 27 27 27 round round;
border: double orange 1em;

Výsledok

Okraj pomocou obrázku.

Zdroj: css3.info