border - Český CSS 3 manuál
Pomocí CSS 3 vlastnosti border nastavujeme rámeček okolo HTML elementu. Podobně jako tomu bylo u pozadí, i border je shrnující vlastnost, ve které nastavujeme 3 vlastnosti rámečku: šířku, styl a barvu.
Syntaxe CSS 3 vlastnosti border je následující:
border: sířka styl barva;
Pro každou složku rámečku existuje zvlášť CSS vlastnost, která ji nastavuje. Informace a příklady jednotlivých složek najdete vždy v příslušném článku. Jsou to:
- border-width - Šířka rámečku
- border-style - Styl rámečku
- border-color - Barva rámečku
Jako hodnotu můžeme uvést i inherit, tím zdědíme vlastnost border od rodičovského elementu.
Border nastaví všechny 4 hrany rámečku na stejný styl. Pokud chceme mít každou hranu jinou, můžeme použít tyto vlastnosti:
- border-bottom - Dolní hrana rámečku
- border-left - Levá hrana rámečku
- border-right - Pravá hrana rámečku
- border-top - Horní hrana rámečku
Ukázka ostylování rámečku elementu
<!DOCTYPE html> <html> <head> <style> #kontejner { border: 3px dotted blue; width: 300px; height: 100px; } </style> </head> <body> <div id="kontejner"> </div> </body> </html>
Výsledek:

Více příkladů najdete u samostatných vlastností, viz. výše. Kromě těchto základních třech vlastností je možné nastavovat např. zakulacené rohy vlastností border-radius.