Má-li být rámeček na všech stranách stejný, poslouží skvěle vlastnost
border. Například definice
border: 1px solid #000;
vede k následujícímu výsledku:
Ukázka
Pokud se má rámeček na jedné straně lišit, například být silnější, stačí po výše uvedené obecné definici změnit příslušnou vlastnost:
border: 1px solid #000; border-right-width: 5px;
Jelikož podle pravidel CSS u rovnocenných pravidel vyhrává poslední, je třeba uvést nejprve obecnou definici a až za ní konkrétní změnu. Výsledek v daném případě vypadá takto:
Ukázka
Jestliže by měla některá ze stran zcela zmizet, stačí sáhnout po její
vlastnosti style:
border: 1px solid #000; border-right-style: none;
Ukázka
Má-li mít některá strana zcela odlišné vlastnosti, je nejvýhodnější změnit je pomocí integrující vlastnosti pro stranu. Vyrobím například růžovou „přechodovou“ hranu mezi bílým pozadím stránky a červenou zvýrazněného odstavce:
border: 1px solid #000; border-right: 5px solid #faa;
Ukázka
Oříškem je, pokud jsou odlišnosti mezi hranami divočejší. Například má-li být rámeček vykreslen na horní a dolní straně, můžete si vybrat, jestli vám lépe vyhovuje
border-top: solid 1px #000; border-bottom: solid 1px #000;
nebo
border: 1px #000; border-style: solid none;
Účinek mají oba stejný:
Ukázka
zpět: CSS – okraje